diff --git a/client/src/pages/FormateurEmargement.tsx b/client/src/pages/FormateurEmargement.tsx
index 44effca..118614e 100644
--- a/client/src/pages/FormateurEmargement.tsx
+++ b/client/src/pages/FormateurEmargement.tsx
@@ -381,19 +381,15 @@ export default function FormateurEmargement() {
                                           minute: "2-digit"
                                         })}</span>
                                         {presenceInfo.signatureUrl && (
-                                          <Button
-                                            size="sm"
-                                            variant="ghost"
-                                            className="h-5 w-5 p-0"
+                                          <img
+                                            src={presenceInfo.signatureUrl}
+                                            alt="Signature"
+                                            className="h-8 w-16 object-contain border border-gray-300 rounded cursor-pointer hover:border-blue-500 transition-colors"
                                             onClick={() => {
                                               setSelectedSignature(presenceInfo.signatureUrl!);
                                               setShowSignatureDialog(true);
                                             }}
-                                          >
-                                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="h-4 w-4 text-blue-600">
-                                              <path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/>
-                                            </svg>
-                                          </Button>
+                                          />
                                         )}
                                       </div>
                                     );
@@ -441,19 +437,15 @@ export default function FormateurEmargement() {
                                           minute: "2-digit"
                                         })}</span>
                                         {presenceInfo.signatureUrl && (
-                                          <Button
-                                            size="sm"
-                                            variant="ghost"
-                                            className="h-5 w-5 p-0"
+                                          <img
+                                            src={presenceInfo.signatureUrl}
+                                            alt="Signature"
+                                            className="h-8 w-16 object-contain border border-gray-300 rounded cursor-pointer hover:border-blue-500 transition-colors"
                                             onClick={() => {
                                               setSelectedSignature(presenceInfo.signatureUrl!);
                                               setShowSignatureDialog(true);
                                             }}
-                                          >
-                                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="h-4 w-4 text-blue-600">
-                                              <path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/>
-                                            </svg>
-                                          </Button>
+                                          />
                                         )}
                                       </div>
                                     );
@@ -561,19 +553,15 @@ export default function FormateurEmargement() {
                               minute: "2-digit"
                             })}</span>
                             {dateGroup.matin.signatureUrl && (
-                              <Button
-                                size="sm"
-                                variant="ghost"
-                                className="h-5 w-5 p-0"
+                              <img
+                                src={dateGroup.matin.signatureUrl}
+                                alt="Signature formateur"
+                                className="h-8 w-16 object-contain border border-gray-300 rounded cursor-pointer hover:border-blue-500 transition-colors"
                                 onClick={() => {
                                   setSelectedSignature(dateGroup.matin.signatureUrl!);
                                   setShowSignatureDialog(true);
                                 }}
-                              >
-                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="h-4 w-4 text-blue-600">
-                                  <path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/>
-                                </svg>
-                              </Button>
+                              />
                             )}
                           </div>
                         )}
@@ -600,19 +588,15 @@ export default function FormateurEmargement() {
                               minute: "2-digit"
                             })}</span>
                             {dateGroup.apres_midi.signatureUrl && (
-                              <Button
-                                size="sm"
-                                variant="ghost"
-                                className="h-5 w-5 p-0"
+                              <img
+                                src={dateGroup.apres_midi.signatureUrl}
+                                alt="Signature formateur"
+                                className="h-8 w-16 object-contain border border-gray-300 rounded cursor-pointer hover:border-blue-500 transition-colors"
                                 onClick={() => {
                                   setSelectedSignature(dateGroup.apres_midi.signatureUrl!);
                                   setShowSignatureDialog(true);
                                 }}
-                              >
-                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="h-4 w-4 text-blue-600">
-                                  <path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/>
-                                </svg>
-                              </Button>
+                              />
                             )}
                           </div>
                         )}
diff --git a/todo.md b/todo.md
index f035c42..a0be5d4 100644
--- a/todo.md
+++ b/todo.md
@@ -1557,3 +1557,12 @@
 - [x] Ajouter une section "Signature Formateur" dans le PDF avec les signatures matin et après-midi
 - [x] Tester la génération PDF avec les signatures formateurs
 - [x] Déployer sur recette et production
+
+
+## Afficher les images de signature directement dans la page d'émargement
+
+- [x] Analyser le code actuel de la page FormateurEmargement.tsx pour identifier où ajouter les images
+- [x] Modifier l'affichage des lignes de présence apprenants pour inclure les images de signature matin et après-midi
+- [x] Modifier l'affichage des lignes de présence formateurs pour inclure les images de signature matin et après-midi
+- [x] Ajuster le layout pour que les images s'affichent correctement à côté des informations existantes
+- [x] Déployer sur le serveur de test (recette) uniquement