Layro について
Layro は React と Tailwind CSS のコンポーネントライブラリで、リモート MCP サーバーを通じてコーディングエージェントに検索、プロパティや使い方の確認、インストール機能を提供します。検索と詳細確認はアカウント不要で、インストールにはトークンが必要です。
主な機能
- 01React コンポーネントライブラリの検索
- 02プロパティと使い方の確認
- 03テスト済みコンポーネントのインストール
- 04インストール時のパッケージバージョン固定
活用シーン
- 01フロントエンド画面用の既存コンポーネント探し
- 02コンポーネントのプロパティと使い方の確認
- 03プロジェクトへのコンポーネント導入
MCP 対応
Layro のリモート MCP サーバーは、MCP クライアントにコンポーネントの検索、詳細確認、インストール機能を提供します。インストールには Layro トークンが必要です。
設定
リモートサーバーはインストール不要です。クライアントを選んで設定をコピーするか、ワンクリックで導入できます。
https://layropro.com/api/mcpclaude mcp add --transport http layro https://layropro.com/api/mcp{"mcpServers":{"layro":{"type":"http","url":"https://layropro.com/api/mcp"}}}Cursor で開く{"servers":{"layro":{"type":"http","url":"https://layropro.com/api/mcp"}}}VS Code で開く{"mcpServers":{"layro":{"type":"http","url":"https://layropro.com/api/mcp"}}}{"mcpServers":{"layro":{"serverUrl":"https://layropro.com/api/mcp"}}}コマンドはターミナルで実行し、JSON は各クライアントの MCP 設定に貼り付けて再起動します。認可が必要なサーバーは初回接続時にログインを求めます。
https://layropro.com/api/mcp認証が必要ツール
8| パラメーター | 型 | 必須 | 説明 |
|---|---|---|---|
| limit | integer | いいえ | 結果の件数。デフォルトは 8 です。 |
| query | string | はい | 必要なものを平易な言葉で指定します："animated dashboard card"、"date range picker"。 |
| category | string | いいえ | このカテゴリのみ（list_categories の一覧にある名前または slug）。 |
詳細
Layro MCP
Layro は、TypeScript で記述され、Tailwind CSS でスタイル設定された、112 個の本番環境向け React UI コンポーネントのライブラリです（うち 62 個は無料です）。 Layro のリモート MCP サーバーを使うと、Cursor、Claude Code、VS Code、Windsurf、Codex などの MCP クライアントからライブラリ全体にアクセスできます。 エージェントはライブラリを検索し、各コンポーネントの props と使い方を確認して、テスト済みのコンポーネントを固定されたパッケージでインストールできます。
インストール
~/.cursor/mcp.json（またはプロジェクト内の .cursor/mcp.json）に追加します。
{
"mcpServers": {
"layro": { "url": "https://layropro.com/api/mcp" }
}
}
検索とコンポーネントの詳細確認にはアカウントは不要です。コンポーネントをインストールするには、https://layropro.com/account から CLI トークンを追加してください。無料アカウントのトークンでは 62 個の無料コンポーネントを利用でき、ライフタイムアクセスでは Pro を利用できます。
{
"mcpServers": {
"layro": {
"url": "https://layropro.com/api/mcp",
"headers": { "Authorization": "Bearer YOUR_LAYRO_TOKEN" }
}
}
}
ドキュメント：https://layropro.com/mcp
コメント
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。