QoderでCurioを使う

Qoderでできるようになること

CurioはModel Context Protocol（MCP）サーバーを提供しています。Qoderを接続すると、ライブラリの検索、スタイルのメタデータの確認、制作対象に必要な完全なデザイン仕様（色の役割、文字サイズの階層、余白のリズム、形状、影、動き）の取得ができます。

Qoderの公式ドキュメントはURLで設定するstreamable HTTPのMCPサーバーに対応しているため、Curioは1件の設定だけでよく、ローカルのプロセスは不要です。設定すら省きたい場合は、共有リンクをチャットに貼り付けてください。

共有リンクをコピーする

最短の方法で、設定は一切要りません。どのスタイルページでも 15 分間有効なリンクを発行できます。改造したい内容と一緒にチャットへ貼り付けてください。

1. 1

   スタイルを選ぶ

   ギャラリーから好きなスタイルのページを開きます。どのスタイルにも、プレビュー付きの専用ページがあります。

   

2. 2

   「Hand off to My AI」を押し、使っている AI を選ぶ

   ボタンを押すと AI クライアントの一覧が開きます。使っているものを選んでください——Claude、ChatGPT、Gemini、WorkBuddy、Qoder、DeepSeek、Kimi など。ここで選ぶと、下のコピーボタンが有効になります。

   

3. 3

   リンクをコピーして AI に貼り付ける

   Curio がリンクを発行し、そのまま使える指示文と一緒にコピーします。チャットに貼り付けて、どれをこのスタイルにしたいか書き添えるだけです。

   

パネルに使っているクライアントがない場合は、どれを選んでも構いません。コピーされるリンクと指示文は同じで、選択はボタンを有効にするためだけのものです。リンクを発行するとそのスタイルの完全な仕様が解放され、クレジットを 1 消費します。15 分以内に同じスタイルをもう一度コピーした場合は再利用され、追加の消費はありません。

MCP経由で接続

1. 1

   QoderのMCP設定を開く

   右上のユーザーアイコンをクリックし、「Qoder 设置」（設定）を開いて左側でMCPを選びます。

2. 2

   Curioサーバーを追加する

   「我的服务」（マイサービス）タブで「+ 添加」（追加）をクリックし、curioという名前でURLにhttps://mcp.designbycurio.com/mcpを指定したmcpServers設定を貼り付けます。QoderはURLからstreamable HTTPを判別するため、typeの指定は不要です。

3. 3

   ログインしてツールを確認する

   保存してログインを完了します。リンクアイコンがサービスの準備完了を示したら、展開してCurioのツール一覧を確認してください。Freeでは無料スタイル、ProまたはMaxではライブラリ全体が使えます。

4. 4

   スタイルを指定して実装する

   QoderにCurioのスタイルを探して実装するよう依頼します。完全な仕様を取得し、そのスタイルの正確なトークンとルールに従ってコンポーネントを書きます。

What you get

一貫した出力：Qoderが生成するすべてのコンポーネントは、一つの信頼できる仕様を基に同じ見た目を保ちます。

由来のあるスタイル。流派、ブランド、伝統に基づくもので、ランダムな配色生成ではありません。

維持の手間がありません。デザインシステムのリポジトリを書く必要も、レビューする必要も、同期する必要もありません。

Example prompts

Curioで抑制の効いたスイススタイルを探し、そのスタイルでこの設定画面を作り直してください。

Apply this Curio design style to the whole component library: <paste share link>.

FAQ