Claude CodeでCurioを使う

Claude Codeでできるようになること

CurioはModel Context Protocol（MCP）サーバーを提供しています。Claude Codeを接続すると、ライブラリの検索、スタイルのメタデータの確認、制作物に必要な色、タイポグラフィ、余白、コンポーネント、ルールを含む完全なデザイン仕様の取得ができるようになります。

読み取り専用で、ログインを利用します。OAuthで一度接続すれば、APIキーの管理は不要です。同じ接続をClaude Code、Cursor、VS Code、CodexなどのMCPクライアントで利用できます。

Setup

1. 1

   CurioのMCPサーバーを追加する

   Claude Codeでhttps://mcp.designbycurio.com/mcpを指定したMCPサーバーを追加します。Claude CodeがブラウザでOAuthログインを開きます。

2. 2

   OAuthでログインする

   メール、Google、GitHubのいずれかでログインし、接続を承認します。Freeアカウントでは無料スタイルを利用でき、ProまたはMaxではライブラリ全体が解放されます。

3. 3

   スタイルを探す

   Claude CodeにCurioを検索するよう依頼します。たとえば「Curioでクリーンなフィンテックスタイルを検索してください」と伝えるか、BauhausやStripeのように直接指定します。search_stylesとget_styleを使って候補を選びます。

4. 4

   制作物に適用する

   Claude Codeにそのスタイルで制作するよう依頼します。get_style_specで完全な仕様を取得し、正確なトークンとルールに従ってスライド、ページ、コンポーネントを生成します。

What you get

一貫した出力：Claude Codeが生成するすべての画面は、毎回推測し直すのではなく一つの信頼できる仕様を基にするため、同じ見た目を保ちます。

実在する個性的なスタイル：一般的な既定デザインではなく、数百の運動、ブランド、伝統から選べるため、AIらしい画一的な見た目を避けられます。

ファイル管理は不要：DESIGN.mdを手書きしたり探したりせず、Claude CodeがMCP経由でその場で取得します。

Example prompts

Curioで温かみのあるエディトリアルデザインスタイルを検索し、そのスタイルで第3四半期の業績をまとめた5枚のスライド資料を作成してください。

CurioのBauhausスタイルを使って、この製品のランディングページのヒーローセクションを作成してください。

FAQ