diff --git a/dsfr/base.html b/dsfr/base.html
index 7f9ae3a7cc206ea1ddaa1313cca65013376d7d10..6b86287875f811a33497527f5e94f7082aaf3c1c 100644
--- a/dsfr/base.html
+++ b/dsfr/base.html
@@ -20,6 +20,7 @@
     <link rel="manifest" href="{{ 'favicon/manifest.webmanifest'|url }}" crossorigin="use-credentials">
     <script src="{{ 'js/strikethrough_replacer.js'|url }}" defer></script>
     <script src="{{ 'js/checkbox_replacer.js'|url }}" defer></script>
+    <script src="{{ 'js/copy_code.js'|url }}" defer></script>
 
     <!-- Modifier les chemins relatifs des favicons en fonction de la structure du projet -->
     <!-- Dans le fichier manifest.webmanifest aussi, modifier les chemins vers les images -->
diff --git a/dsfr/css/theme.css b/dsfr/css/theme.css
index 833ad20037ddaaa395ff3c62b11ccfcf47a94e00..f7abccdfcb8c49da8f0d2b327184ee7d92f3b47c 100644
--- a/dsfr/css/theme.css
+++ b/dsfr/css/theme.css
@@ -239,6 +239,18 @@ th {
     }
 }
 
+.copy-code-button {
+    opacity: 0;
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    transition: all 0.3s ease;
+}
+
+pre:hover .copy-code-button {
+    opacity: 1;
+}
+
 
 pre { line-height: 125%; }
 td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
diff --git a/dsfr/js/copy_code.js b/dsfr/js/copy_code.js
new file mode 100644
index 0000000000000000000000000000000000000000..4ae9be65b2aeb96eadd4a0ee1c0028b7723f6c73
--- /dev/null
+++ b/dsfr/js/copy_code.js
@@ -0,0 +1,30 @@
+document.addEventListener('DOMContentLoaded', () => {
+    const codeBlocks = document.querySelectorAll('pre > code');
+    console.log(codeBlocks)
+
+
+    codeBlocks.forEach((codeBlock, index) => {
+        const copyButton = document.createElement('button');
+        copyButton.textContent = 'Copier';
+        copyButton.className = 'fr-btn fr-btn--sm copy-code-button';
+        copyButton.setAttribute('data-clipboard-index', index);
+        codeBlock.parentElement.style.position = 'relative';
+        codeBlock.parentElement.appendChild(copyButton);
+
+        copyButton.addEventListener('click', () => {
+            const textarea = document.createElement('textarea');
+            textarea.textContent = codeBlock.textContent;
+            document.body.appendChild(textarea);
+            textarea.select();
+            document.execCommand('copy');
+            document.body.removeChild(textarea);
+
+            // Indiquer que le texte a été copié
+            copyButton.textContent = 'Copié!';
+            setTimeout(() => {
+                copyButton.textContent = 'Copier';
+            }, 2000);
+
+        });
+    });
+});