diff --git a/src/_includes/partials/djangokam.njk b/src/_includes/partials/djangokam.njk
index 3fff11b..fa8a9b2 100644
--- a/src/_includes/partials/djangokam.njk
+++ b/src/_includes/partials/djangokam.njk
@@ -4,7 +4,7 @@
         <h2>{{ djangokam.titre }} <span class="accent-text">{{ djangokam.titreAccent }}</span></h2>
         <p class="section-subtitle">{{ djangokam.accroche }}</p>
 
-        {# TODO: visuel officiel DJANGOKAM (src/assets/images/) #}
+        <img src="/assets/images/djangokam-portrait.webp" alt="Portrait officiel de DJANGOKAM" class="djangokam-portrait" width="512" height="512" loading="lazy">
 
         <blockquote class="djangokam-highlight">
             {{ djangokam.message_cle }}
diff --git a/src/assets/css/styles.css b/src/assets/css/styles.css
index 9b9a9cc..fb02e4b 100644
--- a/src/assets/css/styles.css
+++ b/src/assets/css/styles.css
@@ -1400,6 +1400,17 @@ input[type="number"]:focus {
     margin-bottom: 1rem;
 }
 
+.djangokam-portrait {
+    width: 220px;
+    height: 220px;
+    object-fit: cover;
+    border-radius: 30px 15px 30px 15px;  /* Forme organique asymétrique */
+    border: 4px solid var(--or-oki);
+    box-shadow: 0 10px 30px rgba(253, 184, 19, 0.3);
+    margin: 1rem auto 2rem;
+    display: block;
+}
+
 .djangokam-highlight {
     max-width: 800px;
     margin: 2rem auto;
@@ -1497,6 +1508,11 @@ input[type="number"]:focus {
         font-size: 2rem;
     }
 
+    .djangokam-portrait {
+        width: 160px;
+        height: 160px;
+    }
+
     .djangokam-facts {
         grid-template-columns: 1fr;
     }
diff --git a/src/assets/images/djangokam-portrait.webp b/src/assets/images/djangokam-portrait.webp
new file mode 100644
index 0000000..7c0eabc
Binary files /dev/null and b/src/assets/images/djangokam-portrait.webp differ