diff --git a/snippets/vercel-json-generator.mdx b/snippets/vercel-json-generator.mdx
index 60491ea66..196b16f6e 100644
--- a/snippets/vercel-json-generator.mdx
+++ b/snippets/vercel-json-generator.mdx
@@ -85,11 +85,17 @@ export const VercelJsonGenerator = () => {
       <div className="relative">
         <button
           onClick={copyToClipboard}
-          className="absolute top-2 right-2 px-2 py-1 text-sm border dark:border-white/10 rounded hover:bg-zinc-950/5 dark:hover:bg-white/5 transition-colors bg-white"
+          className="absolute top-2 right-2 p-2 rounded-lg transition-all duration-200 group"
         >
-          Copy to Clipboard
+          <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg" className="w-4 h-4 dark:text-white/60 text-gray-400 group-hover:text-gray-500 dark:group-hover:text-white/60 transition-colors">
+            <path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"></path>
+            <path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"></path>
+          </svg>
+          <span className="absolute top-9 left-1/2 transform -translate-x-1/2 bg-primary text-white text-xs px-1.5 py-0.5 rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 whitespace-nowrap">
+            Copy
+          </span>
         </button>
-        <pre className="bg-zinc-950/5 dark:bg-white/5 p-4 rounded-lg overflow-auto text-xs">
+        <pre className="p-4 rounded-lg overflow-auto text-xs border dark:border-white/10">
           <code>{JSON.stringify(vercelConfig, null, 2)}</code>
         </pre>
       </div>