diff --git a/components/PreviewModal.tsx b/components/PreviewModal.tsx
index 0f032c44..e8e924de 100644
--- a/components/PreviewModal.tsx
+++ b/components/PreviewModal.tsx
@@ -1,5 +1,3 @@
-"use client";
-
 import { use, useEffect, useState } from "react";
 import Prism from "prismjs";
 import "prismjs/components/prism-cshtml";
@@ -26,6 +24,11 @@ export function PreviewModal({
     return null;
   }
 
+  const copyToClipboard = async () => {
+    await navigator.clipboard.writeText(html || '');
+    alert('HTML copied to clipboard');
+  };
+
   return (
     <div
       onClick={(e) => {
@@ -55,6 +58,12 @@ export function PreviewModal({
           >
             Code
           </TabButton>
+          <TabButton
+            active={false}
+            onClick={copyToClipboard}
+          >
+            Copy HTML
+          </TabButton>
         </div>
 
         <button
@@ -101,4 +110,4 @@ function TabButton({ active, ...buttonProps }: TabButtonProps) {
     ? "px-4 py-2 text-sm font-medium text-white bg-blue-500 rounded-t-md focus:outline-none focus:ring"
     : "px-4 py-2 text-sm font-medium text-blue-500 bg-transparent hover:bg-blue-100 focus:bg-blue-100 rounded-t-md focus:outline-none focus:ring";
   return <button className={className} {...buttonProps}></button>;
-}
+}
\ No newline at end of file