Coming soon for Chrome

See a design you love? Now it's yours.

PocketUI is a design inspiration tool that extracts colors, fonts, components, and screenshots from any website in one click. Save to folders, export visual components as code, and connect your design library to AI.

Early supporters get 30% off their first year. No spam, ever.

How it helps you

Stop screenshotting. Start building.

You found the perfect design. Now use it as Tailwind tokens, Figma styles, or AI-ready code. No recreating from memory.

One toolbar. Every website.

Pick a color
Scan gradients
Scan images
Scan fonts
Scan SVGs
Capture screenshot
Extract component
Export to Figma
Dark UI
S
Colors & Fonts

Every color on the page, already extracted.

One click to copy HEX, RGB, or HSL. Fonts too — family, weight, and size, detected automatically.

#0F172A
HEX#0F172A
Copy
RGB15, 23, 42
Copy
HSL222°, 47%, 11%
Copy
linear.app
Smart Detection

Open PocketUI. Everything is already found.

Colors, fonts, SVGs, images — detected automatically. Just deselect what you don't need.

Aa
Bb
Aa
Bb
Organized Folders

A design library that builds itself.

Every save goes into concept folders. After a week of browsing, you have a curated library ready for your next project.

⛩️🍱

Dark UI

24 items

Capture Components

Click any element. Get clean code instantly.

Select any component on a live website and get production-ready HTML + Tailwind CSS. Paste it or let your AI use it via MCP.

Start for free
Edit

component

runey.app
Copy HTML
Edit Component
MCP Server

Your AI writes code using your real design tokens.

Connect PocketUI to Cursor, VS Code, Windsurf, and Cline via MCP. No more pasting screenshots into chat.

PocketUI MCP
CursorCursor
VS CodeVS Code
WindsurfWindsurf
ClineCline
Figma Export

Drop it straight into Figma.

Capture any section from a live website and export it to Figma as an editable layer with styles, spacing, and typography intact.

Simple pricing. No surprises.

Free to start. Pro when you're ready.

Free plan

$0/mo

Forever free

Features Included

  • 3 folders
  • 50 saves per month
  • All save types (colors, fonts, screenshots)
  • Browser extension
  • 500 MB storage

You're missing out on

  • - Figma export
  • - MCP server access
  • - Code export
  • - Cloud sync
Join waitlist

Pro plan

$8/mo

$99 billed annually save $45/yr

Features Included

  • Unlimited folders
  • Unlimited saves
  • 10 GB storage
  • Cloud sync across devices
  • Figma export
  • MCP server access
  • Code export
  • Priority support
Join waitlist

Early Adopter Lifetime

$150$79/once

Early Bird price. Pay once, own forever.

20 spots left at $79Then $99

Features Included

  • Everything in Pro, forever
  • Unlimited folders and saves
  • Push saves straight to Figma
  • Let your AI read your design tokens
  • 10 GB storage (lifetime)
  • All future Pro features
  • Early adopter badge
Reserve your spot

No credit card required. Cancel anytime. Only 100 Lifetime spots available, once they're gone, they're gone.

Got questions? We've got answers.

PocketUI is a design inspiration tool and Chrome extension that automatically extracts colors, fonts, components, screenshots, and SVGs from any website. It saves everything into organized folders, exports visual components as clean HTML + Tailwind code, pushes design tokens to Figma, and connects your entire design library to AI coding tools like Claude, Cursor, and Cline via MCP.

PocketUI works with Chrome, Brave, Arc, Edge, and any Chromium-based browser. Firefox support is on the way.

Open PocketUI on any page and it instantly scans every element. It reads computed styles for colors (background, text, borders, gradients), the document.fonts API for typography, and the full DOM for SVGs and images. No eyedropping or manual picking required.

Yes. Pro and Lifetime plans let you export saved colors as Figma styles, fonts as text styles, and screenshots or SVGs directly into your Figma files.

PocketUI includes an MCP (Model Context Protocol) server that connects your saved design tokens, colors, fonts, and components, directly to AI coding tools like Claude, Cursor, Windsurf, and Cline. Your AI writes code using your actual design library instead of guessing.

Yes. Click any element on a live website and PocketUI exports it as clean HTML + Tailwind code you can drop straight into your project. You can also let AI coding tools reference your saved components through the MCP server.

PocketUI has a free plan with 3 folders and 50 saves per month. Pro is $12/month or $99/year for unlimited everything including cloud sync, Figma export, MCP access, and code export. The Lifetime plan starts at $79 (normally $150) and includes everything in Pro forever. Only 100 lifetime spots available.

Bookmarks save a URL. Screenshots save a dead image. PocketUI saves the actual design data: colors as HEX/RGB/HSL, fonts with weights and styles, SVGs as code, and components as HTML + Tailwind. Everything is searchable, organized into folders, and ready to export as code or connect to AI tools.

On Pro and Lifetime plans, yes. Your entire design inspiration library syncs to the cloud and is accessible from any browser or the web dashboard. The free plan stores data locally in your browser.

Yes. PocketUI is a free web to Figma Chrome extension. Browse any website, click any element, and export it as editable Figma layers. Unlike html.to.design or Builder.io, PocketUI lets you select individual components instead of dumping the full page. and gives you clean HTML + Tailwind code alongside the Figma export.

PocketUI has a free tier that includes component extraction and HTML + CSS output. Figma export with editable layers is available on Pro and Lifetime plans. Pro is $12/month or $99/year, and Lifetime starts at $79.

Purple gradient background

Stop recreating designs you've already seen

Join now and get 30% off your first year as an early supporter. One email on launch day. That's it.