diff --git a/app/icon.tsx b/app/icon.tsx
new file mode 100644
index 0000000..c0f6045
--- /dev/null
+++ b/app/icon.tsx
@@ -0,0 +1,31 @@
+import { ImageResponse } from "next/og";
+
+export const size = {
+  width: 32,
+  height: 32,
+};
+
+export const contentType = "image/png";
+
+export default function Icon() {
+  return new ImageResponse(
+    (
+      <div
+        style={{
+          width: "100%",
+          height: "100%",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          background: "white",
+          fontSize: 26,
+        }}
+      >
+        🦞
+      </div>
+    ),
+    {
+      ...size,
+    },
+  );
+}
diff --git a/app/sidebar.tsx b/app/sidebar.tsx
index a5dcfbd..fe52585 100644
--- a/app/sidebar.tsx
+++ b/app/sidebar.tsx
@@ -47,7 +47,7 @@ export function Sidebar() {
           {collapsed ? (
             <div className="flex flex-col items-center gap-2">
               <Link href="/">
-                <span className="text-xl">🐾</span>
+                <span className="text-3xl">🦞</span>
               </Link>
               <button
                 onClick={() => setCollapsed(false)}
@@ -61,7 +61,7 @@ export function Sidebar() {
             <div>
               <div className="flex items-center justify-between">
                 <Link href="/" className="flex items-center gap-2">
-                  <span className="text-xl">🐾</span>
+                  <span className="text-3xl">🦞</span>
                   <div>
                     <div className="text-sm font-bold text-[var(--text)] tracking-wide">OPENCLAW</div>
                     <div className="text-[10px] text-[var(--text-muted)] tracking-wider">BOT DASHBOARD</div>