Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
作者による説明(英語の原文)
Design-style library for AI agents: find a style by use or mood, preview it, apply its spec.
この3つを1つのスコアにまとめることはしません。意見、測定、人気はそれぞれ別のものだからです。
このサーバーのやさしい解説はまだ書いていません。以下はレジストリから読み取った事実です。
使っているAIアプリを選んで、設定をコピーしてください。
Authorization「秘密」と表示された値は、あなたのアカウントの鍵です。絶対に人に教えたり、チャットに貼り付けたりしないでください。
必要なもの
どのアプリを使っていますか?
上でアプリを選んでください。選んだアプリを覚えておくので、次からはボタンに「…にインストール」と表示されます。
このアドレスはリクエストの header にキーが必要ですが、コネクタを追加するメニューでは設定できません。代わりにClaude Code、Cursor、VS Codeを使ってください。
ターミナルでこれを実行します
claude mcp add --transport http curio https://mcp.designbycurio.com/mcp --header 'Authorization: your-value'動かす前に、空欄の値を入力してください。
プロジェクトの .cursor/mcp.json、または ~/.cursor/mcp.json に貼り付けます
{
"mcpServers": {
"curio": {
"url": "https://mcp.designbycurio.com/mcp",
"headers": {
"Authorization": "your-value"
}
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
プロジェクトの .vscode/mcp.json に貼り付けます
{
"servers": {
"curio": {
"type": "http",
"url": "https://mcp.designbycurio.com/mcp",
"headers": {
"Authorization": "your-value"
}
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
このアドレスはリクエストの header にキーが必要ですが、コネクタを追加するメニューでは設定できません。代わりにClaude Code、Cursor、VS Codeを使ってください。
選んだアプリは、この端末のCookieに保存されます。アカウントは不要です。
Authorization 秘密 HTTP headerこの設定は、作者のレジストリ登録情報から作成しています。READMEと違う場合は、READMEに従ってください。
このサーバーは、ツール一覧を表示する前にサインインを求めます。
誰でも見られる情報をチェックしており、コードは読んでいません。当てはまらない項目は数に入れていません。 · 2026年11月8日にチェック
レジストリ名はドメイン designbycurio.com で確認済みです(レジストリがドメインの所有を確認しています)
このリポジトリはまだGitHubから読み取っていません
このリポジトリはまだGitHubから読み取っていません
71ミリ秒で応答(HTTP 401)
OAuthでのサインインに対応しているため、AIアプリがログイン画面へ案内してくれます
まだチェックしていません。エンドポイントをチェックするときにツール一覧を読み取ります
レジストリでこのカテゴリにある有効なすべてのサーバーと比較しています。スターは、公開者がリポジトリの所有者である場合だけ数えます。
当てはまる基本チェック3項目のうち3項目に合格しました。コードは読んでいません。キーやトークンを追加する前に、サーバーがどんなアクセスを求めているかを確認し、必要な権限だけを持つキーを使ってください。
入力が必要なもの:Authorization
作者のクラウドで動きます。インストール不要でインターネット経由でつながりますが、送った内容は作者のサーバーを通ります。
GitHubリポジトリの最終更新は–、最新バージョン(0.5.0)がレジストリに届いたのは18 日前です。
Claude Desktop、Claude Code、Cursor、VS CodeなどのMCP対応アプリで使えます。URLでつながるので、リモートMCPサーバーに対応したアプリ(開発者モードのChatGPTなど)でも使えます。
同じカテゴリには:Figma Context MCP, Claude Real Video, Figma MCP Server
同じカテゴリで、ほかの作者が作ったサーバー。スターの多い順。
カードの見方:↓ 週あたりのダウンロードi★ GitHubスターi3つの柱:レビュー · チェック · 利用状況i更新=最新バージョンをレジストリに公開した日i
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
Let any LLM watch a video locally — and search everything it has ever watched.
The Figma MCP server brings Figma design context directly into your AI workflow.
作者のリポジトリから書かれたとおりにコピーしたものです。PopNx MCPは内容を確認・推奨していません。HTML、画像、スクリプトは取り除いています。リンクはこのサイトの外へ移動します。
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.
https://mcp.designbycurio.com/mcp (streamable HTTP)| Tool | What it does | Cost |
|---|---|---|
search_styles | Keyword search (English or Chinese), with filters: use (what you're making), mood, kind (where the style comes from), color, era, region, dark | free |
list_styles | Browse / paginate with the same filters | free |
get_style | Metadata + 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_spec | Full 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 credits | free |
unlock_style | Unlock a style for good and return its spec — your AI asks you first | 1 credit, once per style |
get_balance | Your credit balance, how many styles you've unlocked, and a link to buy more | free |
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.
gemini extensions install https://github.com/designbycurio/curio-mcp-extension
claude mcp add --transport http curio https://mcp.designbycurio.com/mcp
Settings → Connectors → Add custom connector → https://mcp.designbycurio.com/mcp
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" } } }
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 mcp add curio --url https://mcp.designbycurio.com/mcp
kimi mcp add --transport http --auth oauth curio https://mcp.designbycurio.com/mcp
Settings → Apps & Connectors → Developer mode → add https://mcp.designbycurio.com/mcp.
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.
curio_sk_ and is shown only once.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.
Website · Gallery · Pricing · Docs · Privacy · Terms · support@designbycurio.com