Home/Setup guides/Use Curio with Claude Code

Use Curio with Claude Code

Updated 2026-09-30

Claude Code can build whole interfaces — but on its own it defaults to the same generic look as every other agent. Connect Curio and it can apply any of 2543 real design styles instead, consistently, without you writing a design spec by hand.

What this gives Claude Code

Curio runs a Model Context Protocol (MCP) server. Once Claude Code is connected, it gains tools to search the library, read a style's metadata, and fetch the full design spec — colors, typography, spacing, components, and rules — for whatever you are building.

It is sign-in based: you connect once with OAuth, no API keys to manage, and your AI asks you before spending a credit. The same connection works in Claude Code, Cursor, VS Code, Codex, and other MCP clients.

Connect over MCP

  1. 1

    Add the Curio MCP server

    In Claude Code, add an MCP server pointing at https://mcp.designbycurio.com/mcp. Claude Code will open the OAuth sign-in flow in your browser.

  2. 2

    Sign in with OAuth

    Sign in with email, Google, or GitHub and approve the connection. Connecting and browsing are free; unlocking a style costs 1 credit, once, and your AI asks you first.

  3. 3

    Find a style

    Ask Claude Code to search Curio — for example, "search Curio for a clean fintech style" — or name one directly, like Bauhaus or Stripe. It uses search_styles and get_style to pick a match.

  4. 4

    Apply it to your build

    Tell Claude Code to build in that style. It fetches the full spec with get_style_spec and generates your slides, page, or component using the style's exact tokens and rules.

What you get

Consistent output: every screen Claude Code generates holds the same look, because it works from one authoritative spec instead of re-guessing each time.

Real, distinct styles: hundreds of movements, brands, and traditions — not the generic default — so your work stops looking AI-generated.

No file wrangling: you never hand-write or hunt for a DESIGN.md; Claude Code fetches it live over MCP.

Example prompts

Search Curio for a warm, editorial design style and build a 5-slide deck about our Q3 results in it.
Use the Bauhaus style from Curio to build the landing page hero for this product.

FAQ

Do I need an API key?

No. Curio's MCP server uses OAuth — you sign in once in the browser and Claude Code stays connected. There are no keys to copy or rotate.

Does fetching a style cost anything?

Only the first time. Unlocking a style costs 1 credit, once — the same unlock as on the website — and your AI asks you before spending it. After that, fetching that style is free, and searching and reading introductions are always free.

Does this work in other tools too?

Yes. The same MCP endpoint works in Cursor, VS Code, Codex, ChatGPT, and other MCP-capable clients. See the developer docs for per-client setup.

Read the developer docs
© 2026 Curio