MCP tools reference
What your AI tool can ask PocketUI for once it is connected, how to point it at a folder or one save, and prompts that work.
How it works
- Your AI tool (ChatGPT, Claude, Cursor, VS Code, Claude Code, or any MCP client) talks to
https://pocketui.app/api/mcp, signed in as you. Setup: Use your library with AI. - You never call the tools yourself. You ask in plain words ("use my @Dark UI folder") and the AI picks the tool.
- Read-only. Your AI can read your library. It cannot change, add or delete anything in it.
- It reads what you have saved: the more you save in a folder, the better the AI matches its style.
Pointing at a folder or one save
Names are matched loosely, so "@dark ui" works too. Not sure of a name? Ask: "Use PocketUI. List my folders."
| You write | It means | Example |
|---|---|---|
@Folder name | A whole folder | "Use @Dark UI for this page." |
@Folder / Save name | One saved item in that folder | "Rebuild @Dark UI / Pricing card in React." |
| A topic | Search across everything | "Find my saved pricing tables." |
The tools
Exact parameters for each tool are in the MCP server reference.
| Tool | What your AI gets | Takes |
|---|---|---|
get_library_index | Every folder with its most recent saves. The AI calls this first to find its way around. | Items per folder (default 8) |
get_folders | All folders with their @ references and how many saves each has. | Nothing |
get_folder_context | Everything in one folder, ready to build from: components with code, screenshots, colors, fonts, SVGs, bookmarks. | @Folder, an optional type, how many items |
get_item | One save in full: its code, screenshot, details, plus related colors, fonts and components from the same folder. | @Folder / Save name or an ID |
get_components | Saved components as HTML and CSS, with their fonts and size. | Optional folder |
get_color_palette | Saved colors as hex values, with names and the sites they came from. | Optional folder |
get_typography | Saved fonts with family, weights and sizes. | Optional folder |
get_svgs | Saved SVGs and icons as markup. | Optional folder |
get_design_system | Colors, fonts and gradients combined into design tokens, to set up a theme. | Optional folder |
search_library | Saves matching a word, across names, source sites and content. | A word, optional type and folder |
get_saves | The raw saves of a folder, optionally one type (color, font, svg, component, clip, image, gradient, bookmark). | Folder ID, optional type |
Prompts that work
Say "Use PocketUI" at the start the first time in a session, so the AI knows to look in your library rather than guess.
- Build in a style: "Use PocketUI. Build the pricing page using my @SaaS Inspo folder as the design direction. Match its colors, fonts and spacing."
- Rebuild one thing: "Rebuild @Dark UI / Pricing card as a React component with Tailwind, in this codebase's conventions."
- Set up a theme: "Get the design system from my @Brand folder and create Tailwind theme tokens for colors and fonts."
- Just the colors: "Use the color palette from @Dark UI for this dashboard."
- Find something: "Search my PocketUI library for testimonial sections and show me the best two."
- Icons: "Use the SVG icons I saved in @Icons for this navigation."
Limits
- AI access works on every plan. On Free your library holds 50 saves; Pro and Studio make it unlimited.
- Reading your library through MCP never counts as an export.
- An app you connected, or a personal token, can read your library. Disconnect the app or revoke the token in your profile the moment you no longer use it.
If it does not work
- "Sign in to PocketUI to connect your library": the tool has not signed in yet. Look for a Connect, Authenticate or Sign in button next to PocketUI in its MCP settings.
- "The token is invalid, expired or revoked": the app was disconnected or the token revoked. Connect again (or generate a new token).
- The AI does not use PocketUI: start the prompt with "Use PocketUI", or name the tool: "Call get_folder_context for @Dark UI".
- "Folder not found": check the name with "List my PocketUI folders" and use the
@reference it shows. - Claude Code: type
/mcpand check pocketui shows as connected. Cursor / VS Code: reload the window after editing the config file.
Tips
- Ask the AI to "show me what you got from PocketUI" if you want to see exactly what it read before it builds.