mcpField
C
Curio — design style library

Curio — design style library

Remote
designbycurio.comMedia & Design0Updated 1w ago

About Curio — design style library

Curio is a design-style library for AI agents creating slides, websites, apps, and other materials. It offers searchable styles with previews and machine-readable specifications that can be applied to a design.

Key features

  1. 01Search styles by keyword and filters
  2. 02Browse styles by use and mood
  3. 03View covers and layout screenshots
  4. 04Fetch exact design specifications
  5. 05Unlock styles for continued access
  6. 06Check credit balance

Use cases

  1. 01Find a visual style for a pitch deck
  2. 02Preview a style on slides before choosing
  3. 03Apply a style specification to a website
  4. 04Explore styles for a dashboard or article

MCP support

Provides a remote MCP server with tools to search and browse styles, view previews, retrieve specifications, unlock styles, and check credit balance.

Configuration

Remote servers need no local install. Pick your client, then copy the config or install in one click.

Endpointhttps://mcp.designbycurio.com/mcp
Copy install command
Claude CodeTerminal
Cursor.cursor/mcp.json
VS Code.vscode/mcp.json
Claude Desktopclaude_desktop_config.json
Windsurf~/.codeium/windsurf/mcp_config.json

Run commands in a terminal; paste JSON into the client’s MCP config and restart. Servers that need sign-in will prompt on first connect.

All endpoints
Streamable HTTPhttps://mcp.designbycurio.com/mcpAuth required

Tools

Details

From the project README

Curio MCP

Connect your AI to Curio — a design-style library built for AI agents. Thousands of design styles (real design movements, brands, cultural traditions), each with a machine-readable spec your agent can apply directly to slides, websites, and products.

  • Find the right style: search in English or Chinese, or filter by what you're making (slides, websites, apps, stores, articles, posters…) and the feel you want (minimal, luxury, playful, retro, futuristic…).

  • See it before you pick it: every style comes with a cover image and, on request, screenshots of real layouts — slide cover, content and data slides, a dashboard, a pricing page, an article.

  • Apply it exactly: fetch the full design spec (DESIGN.md) and your AI uses its exact colors, type, spacing and components.

  • Endpoint: https://mcp.designbycurio.com/mcp (streamable HTTP)

  • Auth: OAuth sign-in for most clients. A client that can't open a browser to sign in uses a personal API key instead. Searching, browsing and previews are free; 1 credit unlocks a style for good (credit packs, never expire). Out of credits? Your AI gives you a link to buy more.

  • Protocol: MCP 2026-07-28 and the 2025 revisions

  • Docs: designbycurio.com/docs

Tools

ToolWhat it doesCost
search_stylesKeyword search (English or Chinese), with filters: use (what you're making), mood, kind (where the style comes from), color, era, region, darkfree
list_stylesBrowse / paginate with the same filtersfree
get_styleMetadata + cover image for one style; pass scenes for screenshots of real layouts (slide-cover, slide-content, slide-data, dashboard, price, article, or all)free
get_style_specFull design spec (DESIGN.md) for a style you've unlocked; for a locked style it returns the cost, your balance and a link to buy creditsfree
unlock_styleUnlock a style for good and return its spec — your AI asks you first1 credit, once per style
get_balanceYour credit balance, how many styles you've unlocked, and a link to buy morefree

Your AI never spends a credit on its own: get_style_spec only reads, and unlock_style is meant to be called after you agree. Unlocking a style you already own costs nothing.

Install

Gemini CLI
gemini extensions install https://github.com/designbycurio/curio-mcp-extension
Claude Code
claude mcp add --transport http curio https://mcp.designbycurio.com/mcp
Claude.ai / Claude Desktop

Settings → Connectors → Add custom connector → https://mcp.designbycurio.com/mcp

Cursor

Add to Cursor

The button opens Cursor and adds Curio for you. Or add it to ~/.cursor/mcp.json yourself — Cursor opens a browser to sign in on first use:

{
  "mcpServers": {
    "curio": { "url": "https://mcp.designbycurio.com/mcp" }
  }
}
VS Code (Copilot)

Install in VS Code Install in VS Code Insiders

The button opens VS Code and installs Curio in your user MCP config. Or add it to .vscode/mcp.json yourself — VS Code opens a browser to authorize on first connect:

{
  "servers": {
    "curio": { "type": "http", "url": "https://mcp.designbycurio.com/mcp" }
  }
}
Codex (CLI / IDE extension)
codex mcp add curio --url https://mcp.designbycurio.com/mcp
Kimi Code CLI
kimi mcp add --transport http --auth oauth curio https://mcp.designbycurio.com/mcp
ChatGPT

Settings → Apps & Connectors → Developer mode → add https://mcp.designbycurio.com/mcp.

API key

Some clients can't open a browser to sign in — they only have a field for a token (ZCode, WorkBuddy, Qoder, Trae, Cherry Studio, Antigravity, Manus…). For those, create a personal API key and send it as a request header. Clients that can sign in with OAuth don't need one.

  1. Sign in at designbycurio.com and open Account → Connected apps → API keys. Name the key after the client and create it.
  2. Copy the key straight away — it starts with curio_sk_ and is shown only once.
  3. In the client's MCP settings, add the server URL with this header:
Authorization: Bearer curio_sk_…

Most clients take a JSON block like this. Some name the address field serverUrl or httpUrl, or ask for a transport type — pick streamable HTTP.

{
  "mcpServers": {
    "curio": {
      "url": "https://mcp.designbycurio.com/mcp",
      "headers": { "Authorization": "Bearer curio_sk_…" }
    }
  }
}

Claude Code takes the header on the command line:

claude mcp add --transport http curio https://mcp.designbycurio.com/mcp --header "Authorization: Bearer curio_sk_…"

Codex reads the key from an environment variable, so it never sits in a config file:

export CURIO_API_KEY=curio_sk_…
codex mcp add curio --url https://mcp.designbycurio.com/mcp --bearer-token-env-var CURIO_API_KEY

VS Code can prompt for the key and store it securely instead of writing it into mcp.json:

{
  "inputs": [
    { "type": "promptString", "id": "curio-key", "description": "Curio API key", "password": true }
  ],
  "servers": {
    "curio": {
      "type": "http",
      "url": "https://mcp.designbycurio.com/mcp",
      "headers": { "Authorization": "Bearer ${input:curio-key}" }
    }
  }
}

Two kinds of key. A read-only key (the default) can search, browse and fetch styles you've already unlocked, and never spends credits. Tick Allow it to spend credits to unlock styles when you create a key and your AI may also call unlock_style — after asking you, same as over OAuth. Treat a key like a password: don't paste it into a chat or commit it to a repo. Revoke it any time on the same page; clients using it stop working within 30 seconds.

Example prompts

  • "Find a Japanese minimal style and restyle my landing page with it."
  • "Show me how the Swiss International style looks on slides before I pick it."
  • "Find a luxurious style for my pitch deck."
  • "找一个适合做 PPT、显高级的风格。"
  • "Browse Curio for an 80s retro style that works for a dashboard."
  • "Fetch the bauhaus-weimar spec and apply it to my slides."
  • "How many Curio credits do I have left?"

Links

Website · Gallery · Pricing · Docs · Privacy · Terms · [email protected]

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.