diff --git a/src/khoj/interface/web/assets/icons/copy-button-success.svg b/src/khoj/interface/web/assets/icons/copy-button-success.svg
new file mode 100644
index 00000000..7a00dcd0
--- /dev/null
+++ b/src/khoj/interface/web/assets/icons/copy-button-success.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M22 11.1V6.9C22 3.4 20.6 2 17.1 2H12.9C9.4 2 8 3.4 8 6.9V8H11.1C14.6 8 16 9.4 16 12.9V16H17.1C20.6 16 22 14.6 22 11.1Z" stroke="#292D32" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path fill="#00ff00" d="M16 17.1V12.9C16 9.4 14.6 8 11.1 8H6.9C3.4 8 2 9.4 2 12.9V17.1C2 20.6 3.4 22 6.9 22H11.1C14.6 22 16 20.6 16 17.1Z" stroke="#292D32" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6.08008 14.9998L8.03008 16.9498L11.9201 13.0498" stroke="#292D32" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/src/khoj/interface/web/assets/icons/copy-button.svg b/src/khoj/interface/web/assets/icons/copy-button.svg
new file mode 100644
index 00000000..36fc8971
--- /dev/null
+++ b/src/khoj/interface/web/assets/icons/copy-button.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.4" d="M16 12.9V17.1C16 20.6 14.6 22 11.1 22H6.9C3.4 22 2 20.6 2 17.1V12.9C2 9.4 3.4 8 6.9 8H11.1C14.6 8 16 9.4 16 12.9Z" stroke="#292D32" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M22 6.9V11.1C22 14.6 20.6 16 17.1 16H16V12.9C16 9.4 14.6 8 11.1 8H8V6.9C8 3.4 9.4 2 12.9 2H17.1C20.6 2 22 3.4 22 6.9Z" stroke="#292D32" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/src/khoj/interface/web/assets/icons/copy_button.svg b/src/khoj/interface/web/assets/icons/copy_button.svg
deleted file mode 100644
index fadf344a..00000000
--- a/src/khoj/interface/web/assets/icons/copy_button.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path d="M6 11C6 8.17157 6 6.75736 6.87868 5.87868C7.75736 5 9.17157 5 12 5H15C17.8284 5 19.2426 5 20.1213 5.87868C21 6.75736 21 8.17157 21 11V16C21 18.8284 21 20.2426 20.1213 21.1213C19.2426 22 17.8284 22 15 22H12C9.17157 22 7.75736 22 6.87868 21.1213C6 20.2426 6 18.8284 6 16V11Z" stroke="#1C274C" stroke-width="1.5"></path> <path d="M6 19C4.34315 19 3 17.6569 3 16V10C3 6.22876 3 4.34315 4.17157 3.17157C5.34315 2 7.22876 2 11 2H15C16.6569 2 18 3.34315 18 5" stroke="#1C274C" stroke-width="1.5"></path> </g></svg>
diff --git a/src/khoj/interface/web/chat.html b/src/khoj/interface/web/chat.html
index 1b2ccda0..f4f14d8b 100644
--- a/src/khoj/interface/web/chat.html
+++ b/src/khoj/interface/web/chat.html
@@ -30,20 +30,21 @@ To get started, just start typing below. You can also type / to see a list of co
         const allowedExtensions = ['text/org', 'text/markdown', 'text/plain', 'text/html', 'application/pdf'];
         const allowedFileEndings = ['org', 'md', 'txt', 'html', 'pdf'];
         let chatOptions = [];
-        function copyProgrammaticOutput(event) {
-            // Remove the first 4 characters which are the "Copy" button
+        function copyParentText(event) {
             const button = event.currentTarget;
-            const programmaticOutput = button.parentNode.textContent.trim();
-            navigator.clipboard.writeText(programmaticOutput).then(() => {
-                button.textContent = "✅ Copied to clipboard!";
+            const textContent = button.parentNode.textContent.trim();
+            navigator.clipboard.writeText(textContent).then(() => {
+                button.firstChild.src = "/static/assets/icons/copy-button-success.svg";
                 setTimeout(() => {
-                    button.textContent = "✅";
+                    button.firstChild.src = "/static/assets/icons/copy-button.svg";
                 }, 1000);
             }).catch((error) => {
                 console.error("Error copying programmatic output to clipboard:", error);
-                button.textContent = "⛔️ Failed to copy!";
+                const originalButtonText = button.innerHTML;
+                button.innerHTML = "⛔️";
                 setTimeout(() => {
-                    button.textContent = "⛔️";
+                    button.innerHTML = originalButtonText;
+                    button.firstChild.src = "/static/assets/icons/copy-button.svg";
                 }, 1000);
             });
         }
@@ -365,11 +366,12 @@ To get started, just start typing below. You can also type / to see a list of co
                 // Add a copy button to each element
                 let copyButton = document.createElement('button');
                 copyButton.classList.add("copy-button");
+                copyButton.title = "Copy Code";
                 let copyIcon = document.createElement("img");
-                copyIcon.src = "/static/assets/icons/copy_button.svg";
+                copyIcon.src = "/static/assets/icons/copy-button.svg";
                 copyIcon.classList.add("copy-icon");
                 copyButton.appendChild(copyIcon);
-                copyButton.addEventListener('click', copyProgrammaticOutput);
+                copyButton.addEventListener('click', copyParentText);
                 codeElement.prepend(copyButton);
             });
 
@@ -2183,7 +2185,7 @@ To get started, just start typing below. You can also type / to see a list of co
         }
 
         button.copy-button:hover {
-            background-color: black;
+            background-color: var(--primary-hover);
             color: #f5f5f5;
         }