diff --git a/README.md b/README.md
index ce723a8..60e6dc2 100644
--- a/README.md
+++ b/README.md
@@ -1,11 +1,19 @@
-# @saiden/browse
+<p align="center">
+  <img src="logo.png" alt="browse" width="120" />
+</p>
 
-[![npm version](https://img.shields.io/npm/v/@saiden/browse.svg)](https://www.npmjs.com/package/@saiden/browse)
-[![CI](https://github.com/saiden-dev/browse/actions/workflows/ci.yml/badge.svg)](https://github.com/saiden-dev/browse/actions/workflows/ci.yml)
-[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![Node.js](https://img.shields.io/node/v/@saiden/browse.svg)](https://nodejs.org)
+<h1 align="center">@saiden/browse</h1>
 
-Headless browser automation via MCP using Playwright WebKit.
+<p align="center">
+  <a href="https://www.npmjs.com/package/@saiden/browse"><img src="https://img.shields.io/npm/v/@saiden/browse.svg" alt="npm version"></a>
+  <a href="https://github.com/saiden-dev/browse/actions/workflows/ci.yml"><img src="https://github.com/saiden-dev/browse/actions/workflows/ci.yml/badge.svg" alt="CI"></a>
+  <a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/badge/License-MIT-yellow.svg" alt="License: MIT"></a>
+  <a href="https://nodejs.org"><img src="https://img.shields.io/node/v/@saiden/browse.svg" alt="Node.js"></a>
+</p>
+
+<p align="center">
+  Headless browser automation via MCP using Playwright WebKit.
+</p>
 
 ## Installation
 
diff --git a/logo-512.png b/logo-512.png
new file mode 100644
index 0000000..694f8d5
Binary files /dev/null and b/logo-512.png differ
diff --git a/logo.png b/logo.png
new file mode 100644
index 0000000..0be9a5e
Binary files /dev/null and b/logo.png differ
diff --git a/logo.svg b/logo.svg
new file mode 100644
index 0000000..0bf08c2
--- /dev/null
+++ b/logo.svg
@@ -0,0 +1,43 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" width="200" height="200">
+  <defs>
+    <linearGradient id="blueGrad" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#4B9CD3"/>
+      <stop offset="100%" style="stop-color:#3178C6"/>
+    </linearGradient>
+    <linearGradient id="darkGrad" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" style="stop-color:#2d2d3a"/>
+      <stop offset="100%" style="stop-color:#1a1a2e"/>
+    </linearGradient>
+  </defs>
+
+  <!-- Background circle -->
+  <circle cx="100" cy="100" r="95" fill="white"/>
+
+  <!-- Browser window -->
+  <rect x="25" y="35" width="150" height="130" rx="12" fill="url(#darkGrad)" stroke="#3178C6" stroke-width="3"/>
+
+  <!-- Browser title bar -->
+  <rect x="25" y="35" width="150" height="28" rx="12" fill="#3178C6"/>
+  <rect x="25" y="51" width="150" height="12" fill="#3178C6"/>
+
+  <!-- Window buttons -->
+  <circle cx="42" cy="49" r="5" fill="#FF5F57"/>
+  <circle cx="58" cy="49" r="5" fill="#FFBD2E"/>
+  <circle cx="74" cy="49" r="5" fill="#28CA42"/>
+
+  <!-- URL bar -->
+  <rect x="90" y="42" width="75" height="14" rx="4" fill="#1a1a2e"/>
+
+  <!-- Browser content area - globe/web icon -->
+  <circle cx="100" cy="115" r="35" stroke="#3178C6" stroke-width="3" fill="none"/>
+  <ellipse cx="100" cy="115" rx="15" ry="35" stroke="#3178C6" stroke-width="2" fill="none"/>
+  <line x1="65" y1="115" x2="135" y2="115" stroke="#3178C6" stroke-width="2"/>
+  <path d="M70 95 Q100 90 130 95" stroke="#3178C6" stroke-width="2" fill="none"/>
+  <path d="M70 135 Q100 140 130 135" stroke="#3178C6" stroke-width="2" fill="none"/>
+
+  <!-- Cursor pointer -->
+  <g transform="translate(130, 130)">
+    <path d="M0 0 L0 28 L8 20 L14 32 L20 29 L14 17 L24 17 Z"
+          fill="white" stroke="#3178C6" stroke-width="2" stroke-linejoin="round"/>
+  </g>
+</svg>