Cursor MCP でコンポーネントを探す方法｜ブラウザを開かずに LP を組む

カタログをブラウザで開き、コピーし、Cursor に戻る、という往復は、1日に何度もあると切れます。MCP を足すと、エージェントが検索と取得まで行います。

DesignLayer の MCP は、公開カタログの検索と、サイトの Copy for Cursor と同じ包みの取得です。コピー枠のルールもサイトと同じです。

サイト側の手順は https://design-layer.com/articles/cursor-react-motion-components-guide です。この記事は MCP に絞ります。

search_catalog：公開カタログを検索します。query や category（hero、pricing、gallery など）で絞れます。

get_component：コンポーネントのコピーバンドルを取得します。無料は日本時間で1日3回、Pro は無制限です。

get_template：完成1ページです。Pro のみです。

アカウント設定で API キーを発行し、Cursor の MCP 設定に DESIGNLAYER_API_KEY として登録します。詳しい画面操作はドキュメント「DesignLayer MCP を Cursor に接続する」です。

キーをリポジトリにコミットしないでください。

「DesignLayer のカタログから SaaS 向けのヒーローを探し、ライブの動きに近いものを1つ選んで、components/sections/ に入れて。見出しをプロダクト名に差し替えて。」

先に search_catalog、次に id を指定して get_component、という順が安定します。いきなり取得すると、枠を消費しやすいです。

プレビューと検索は何度でもできます。ソース取得だけが回数制限です。「今日はヒーロー」と決めて呼んでください。

Pro は月額2,980円・税込で、コンポーネント無制限と Templates です。

MCP は、カタログを日常のコーディングに混ぜるための入口です。まだ接続していないなら、今日はサイトで1回コピーし、来週キーを足す、でも構いません。閲覧はカード不要です。https://design-layer.com/components