diff --git a/src/app/icon.svg b/src/app/icon.svg
new file mode 100644
index 0000000..18ff582
--- /dev/null
+++ b/src/app/icon.svg
@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+  <rect width="32" height="32" rx="6" fill="hsl(0 0% 12%)"/>
+  <g transform="translate(4 4)" fill="none" stroke="hsl(276 100% 68.4%)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+    <circle cx="11" cy="11" r="8"/>
+    <line x1="21" y1="21" x2="16.65" y2="16.65"/>
+  </g>
+</svg>
diff --git a/src/app/icon.tsx b/src/app/icon.tsx
deleted file mode 100644
index a492fc5..0000000
--- a/src/app/icon.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import { ImageResponse } from 'next/og'
-
-export const runtime = 'edge'
-
-export const size = {
-  width: 32,
-  height: 32,
-}
-export const contentType = 'image/png'
-
-export default function Icon() {
-  return new ImageResponse(
-    (
-      <div
-        style={{
-          display: 'flex',
-          alignItems: 'center',
-          justifyContent: 'center',
-          width: '100%',
-          height: '100%',
-          borderRadius: '6px',
-          background: 'hsl(0 0% 12%)', // Dark background
-        }}
-      >
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="hsl(276 100% 68.4%)" // Vibrant purple
-          strokeWidth="2.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        >
-          <circle cx="11" cy="11" r="8" />
-          <line x1="21" y1="21" x2="16.65" y2="16.65" />
-        </svg>
-      </div>
-    ),
-    {
-      ...size,
-    }
-  )
-}