PocketUI

Give Claude Code your design taste

Connect your PocketUI library in a minute, no keys to paste. Ask for a page “in my @Dark UI style” and Claude Code builds it from the colors, fonts and components you saved.

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

Setup

Claude Code, connected in a minute

  1. 1

    Add PocketUI to Claude Code

    Run this in your terminal. Then type /mcp inside Claude Code, pick pocketui and choose Authenticate.

  2. 2

    Sign in and click Allow

    Claude Code opens PocketUI. Sign in, check what it can see, and click Allow. Nothing to copy, no keys to paste.

  3. 3

    Ask in your own words

    Mention a folder with @, like @Dark UI, and Claude Code builds from what you saved in it.

Terminal
claude mcp add pocketui --transport http --scope user https://pocketui.app/api/mcp

Every endpoint and tool is in the MCP server reference.

Then ask

What to ask Claude Code

“Build a pricing page in my @Dark UI style”

“Use the colors and fonts from my @Pricing folder”

“Rebuild the hero I saved from linear.app in our design system”

Design skill

Make Claude Code build like the sites you saved

Add the free PocketUI design skill and it turns a folder into a design system, starts from your saved components and checks the result against them.

Terminal
curl -fsSL https://pocketui.app/skills/pocketui-design/SKILL.md \
  --create-dirs -o ~/.claude/skills/pocketui-design/SKILL.md

How it works and how it compares: the PocketUI design skill.

PocketUI and Claude Code

No. The MCP server is read-only. Claude Code can read your folders and saves and use them while it builds, but it cannot add, edit or delete anything.

Your folders and what is in them: colors, fonts, components with their HTML and CSS, screenshots, SVGs and bookmarks, plus a design summary of each folder.

Any plan, Free included. Free is 50 saves in total; Pro and Studio make the library unlimited.

Click Disconnect next to Claude Code in Profile → AI. Its access ends straight away.

Yes. For scripts or tools set up by hand, create a personal token in Profile → AI and send it as a Bearer token. Every setup is in the MCP server docs.

Also works withCursorChatGPTClaudeVS CodeWindsurfGemini CLICodexAll agents
Purple gradient background

Stop recreating designs you've already seen

Join now and get 30% off your first year as an early supporter. A quick confirmation now, then one email on launch day.