diff --git a/frontend/src/components/copy-button.ts b/frontend/src/components/copy-button.ts
index 77856b75..8ef80d0d 100644
--- a/frontend/src/components/copy-button.ts
+++ b/frontend/src/components/copy-button.ts
@@ -40,12 +40,15 @@ export class CopyButton extends LitElement {
 
   render() {
     return html`
-      <sl-button
-        size="small"
-        @click=${this.onClick}
-        ?disabled=${!this.value && !this.getValue}
-        >${this.isCopied ? msg("Copied") : msg("Copy")}</sl-button
-      >
+      <sl-tooltip content=${this.isCopied ? msg("Copied to clipboard!") : msg("Copy")}>
+        <sl-icon-button
+          size="small"
+          name=${this.isCopied ? "check-lg" : "files"}
+          label=${msg("Copy to clipboard")}
+          @click=${this.onClick}
+          ?disabled=${!this.value && !this.getValue}
+          ></sl-icon-button>
+      </sl-tooltip>
     `;
   }
 
@@ -59,6 +62,8 @@ export class CopyButton extends LitElement {
 
     this.timeoutId = window.setTimeout(() => {
       this.isCopied = false;
+      const button = this.shadowRoot?.querySelector('sl-icon-button');
+      button?.blur(); // Remove focus from the button to set it back to its default state
     }, 3000);
   }
 }