# Refcat

> Refcat is a UI reference library and AI design agent built on real, shipped products: searchable screens, complete user flows, product emails, websites and game UI, with export to Figma and an MCP server so AI assistants can ground design and frontend work in real patterns instead of inventing them.

Use Refcat when a task needs evidence for a UI decision (onboarding, checkout, paywalls, settings, empty states, emails…). Catalog content is screenshots and flows from real apps; the web app requires a Google sign-in, and the MCP server requires an API key.

## AI integration (MCP)

- [MCP setup guide](https://refcat.app/en/guides/mcp): create an API key and connect Claude, Cursor or any MCP client
- Endpoint: `https://mcp.refcat.app/mcp` (Streamable HTTP). Send `Authorization: Bearer <API_KEY>`; keys are created in the web app under Account → API keys and shown once
- Permissions per key: `catalog:read` and `projects:read` by default; `projects:write` and `generation:write` must be granted explicitly
- Limits per plan: Free 1 key at 30 requests/min, Pro 3 keys at 120/min, Studio 10 keys at 300/min

Client configuration:

```json
{ "mcpServers": { "refcat": { "url": "https://mcp.refcat.app/mcp", "headers": { "Authorization": "Bearer <API_KEY>" } } } }
```

Tools (23):

- `list_facets`: the real filter values (platform, flowIntents, uiComponents, pageType, screenPatterns) with counts; call it before filtering
- `search_screens`: individual UI screens by description, app name or website (e.g. "dark paywall with three cards", "Spotify"); `includeImages` returns the top 4 as images; `offset` paginates
- `get_screen`: one screen as an image block plus its structure: app, flow, platform, pageType, keyTexts, dimensions, capture date and `elements` (OCR text and hotspots with normalized boxes). Use the elements for hierarchy and order, the image for color, type and spacing
- `search_flows`, `get_flow`: whole flows (ordered screen sequences); `get_flow` is compact by default, `include: ["elements", "connections"]` for more
- `search_apps`, `get_app`, `get_app_flows`, `similar_apps`, `list_apps`, `list_categories`: find an app and read every flow it has
- `get_flow_history`: earlier captures of the same flow
- `search_screens_by_image`: visual search from base64 images (e.g. a screenshot of the app being built)
- `similar_screens`: screens that look like a given screen
- `search_emails`, `get_email_html`: real product emails; `get_email_html` returns the original HTML when `hasHtml` is true
- `export_design_system`: a design system document in Markdown (tokens, typography, components, states) from a flow; uses one monthly export, so ask the user first (`generation:write`)
- `list_projects`, `get_project`, `create_project`, `add_screen`, `move_screen`: work with the caller's projects (`projects:*` permissions)
- `generate_screen`: generate an image for an empty project slot; costs money and uses the AI screen quota, so ask the user first

Prompts (slash commands in Claude Code): `implement_screen`, `pick_pattern`, `review_my_screen`, `audit_onboarding`, `build_flow`. Resources: `refcat://screen/{id}`, `refcat://screen/{id}/image`, `refcat://flow/{id}`, `refcat://project/{slug}`.

Agent instructions to drop into a project: [Claude Code skill](https://refcat.app/refcat-skill.md) (save as `.claude/skills/refcat/SKILL.md`) and [Cursor rules](https://refcat.app/refcat-cursor.mdc) (save as `.cursor/rules/refcat.mdc`).

## Product

- [Home](https://refcat.app/en): what Refcat does, plans and FAQ
- [Web app](https://refcat.app/dashboard/): search the catalog, save folders, share them by link and build projects (Google sign-in)
- Public catalog pages follow `https://refcat.app/{locale}/library/apps/{app}/flows/{flow}/screens/{screen}`; they are listed in the [sitemap](https://refcat.app/sitemap.xml)

## Plans

- Free: preview screens plus 10 full flows each week, 50 saved references, 3 projects, 5 browser-to-Figma exports per month, 1 seat
- Pro ($10/month or $110/year): every flow, unlimited saved references, 20 exports per month per seat, catalog-to-Figma and design system exports, 100 AI screens per month shared by the team, 1 brand kit, 3 MCP keys at 120 requests/min, 2 seats
- Studio ($39/month or $420/year): unlimited brand kits (palette and typography applied to generated screens), 10 MCP keys at 300 requests/min, unlimited exports, 500 AI screens per month shared by the team, 6 seats

## Browser extension

- [Web to Figma extension guide](https://refcat.app/en/guides/web-to-figma): export live websites to Figma; supported text and SVG become editable layers
- [Download (ZIP)](https://refcat.app/downloads/refcat-web-to-figma.zip)

## Updates

- [Blog](https://refcat.app/en/blog)
- [Changelog](https://refcat.app/en/changelog)
- [Roadmap](https://refcat.app/en/roadmap)

## Optional

- Localized sites: [Português](https://refcat.app/pt-br), [Español](https://refcat.app/es)
- [Terms](https://refcat.app/en/terms), [Privacy](https://refcat.app/en/privacy), [Cookies](https://refcat.app/en/cookies)
- Contact: hello@refcat.app