feat(seo): add OG image template (SVG)

DevanshuNEU · DevanshuNEU · commit f752628b6d49 · 2026-02-16T20:47:09.000-05:00
- Created og-image.svg as template (1200x630)
- Need to convert to PNG for full social platform support
- Updated meta tags to reference PNG
diff --git a/frontend/public/og-image.svg b/frontend/public/og-image.svg
@@ -0,0 +1,61 @@
+<svg width="1200" height="630" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#0a0a0f"/>
+      <stop offset="100%" style="stop-color:#1a1a2e"/>
+    </linearGradient>
+    <linearGradient id="accent" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:#6366f1"/>
+      <stop offset="100%" style="stop-color:#8b5cf6"/>
+    </linearGradient>
+  </defs>
+  
+  <!-- Background -->
+  <rect width="1200" height="630" fill="url(#bg)"/>
+  
+  <!-- Grid pattern -->
+  <pattern id="grid" width="40" height="40" patternUnits="userSpaceOnUse">
+    <path d="M 40 0 L 0 0 0 40" fill="none" stroke="#ffffff08" stroke-width="1"/>
+  </pattern>
+  <rect width="1200" height="630" fill="url(#grid)"/>
+  
+  <!-- Accent line -->
+  <rect x="80" y="200" width="120" height="4" fill="url(#accent)" rx="2"/>
+  
+  <!-- Logo/Title -->
+  <text x="80" y="280" font-family="Inter, system-ui, sans-serif" font-size="64" font-weight="700" fill="#ffffff">
+    OpenCodeIntel
+  </text>
+  
+  <!-- Tagline -->
+  <text x="80" y="350" font-family="Inter, system-ui, sans-serif" font-size="32" font-weight="400" fill="#a1a1aa">
+    Understand Any Codebase
+  </text>
+  
+  <!-- Description -->
+  <text x="80" y="420" font-family="Inter, system-ui, sans-serif" font-size="24" font-weight="400" fill="#71717a">
+    Semantic code search powered by AI
+  </text>
+  
+  <!-- Code snippet decoration -->
+  <rect x="750" y="180" width="370" height="270" rx="12" fill="#16161e" stroke="#27272a" stroke-width="1"/>
+  <circle cx="775" cy="205" r="6" fill="#f87171"/>
+  <circle cx="795" cy="205" r="6" fill="#fbbf24"/>
+  <circle cx="815" cy="205" r="6" fill="#4ade80"/>
+  
+  <text x="775" y="250" font-family="JetBrains Mono, monospace" font-size="16" fill="#6366f1">const</text>
+  <text x="830" y="250" font-family="JetBrains Mono, monospace" font-size="16" fill="#ffffff">search</text>
+  <text x="905" y="250" font-family="JetBrains Mono, monospace" font-size="16" fill="#6366f1">=</text>
+  <text x="920" y="250" font-family="JetBrains Mono, monospace" font-size="16" fill="#fbbf24">"auth logic"</text>
+  
+  <text x="775" y="290" font-family="JetBrains Mono, monospace" font-size="16" fill="#71717a">// finds: login, oauth,</text>
+  <text x="775" y="320" font-family="JetBrains Mono, monospace" font-size="16" fill="#71717a">// jwt validation...</text>
+  
+  <text x="775" y="370" font-family="JetBrains Mono, monospace" font-size="16" fill="#4ade80">✓ 47 results</text>
+  <text x="775" y="400" font-family="JetBrains Mono, monospace" font-size="16" fill="#71717a">across 12 files</text>
+  
+  <!-- URL -->
+  <text x="80" y="560" font-family="Inter, system-ui, sans-serif" font-size="20" font-weight="500" fill="#6366f1">
+    opencodeintel.dev
+  </text>
+</svg>
