Landingfolio

Landingfolio MCP

AI エージェントにデザインセンスを与えましょう。 Landingfolio MCP は、Landingfolio のギャラリーを Claude Code、Cursor、Codex、Windsurf、VS Code、その他あらゆる MCP クライアントに接続します。エージェントはヒーローセクション、料金表、お客様の声、機能紹介、CTA、フッター、ランディングページ全体、OG 画像の実際のスクリーンショットを取得し、汎用的な AI レイアウトではなく、それらを参考に構築します。

• リモートサーバーなのでインストール不要です：https://mcp.landingfolio.com/mcp（Streamable HTTP）
• 無料：トークンごとに1日20回までコンポーネントを取得できます。トークンは landingfolio.com/mcp で取得してください。

インストール

lf_YOUR_TOKEN を landingfolio.com/mcp で取得したトークンに置き換えてください。

Claude Code

claude mcp add --transport http landingfolio https://mcp.landingfolio.com/mcp --header "Authorization: Bearer lf_YOUR_TOKEN"

またはプラグインとして使用します（先にシェルで LANDINGFOLIO_TOKEN を設定してください）：

/plugin marketplace add dannypostma/landingfolio-mcp
/plugin install landingfolio@landingfolio

Cursor / Windsurf / その他のクライアント

~/.cursor/mcp.json、~/.codeium/windsurf/mcp_config.json、またはクライアントの MCP 設定：

{
  "mcpServers": {
    "landingfolio": {
      "url": "https://mcp.landingfolio.com/mcp",
      "headers": { "Authorization": "Bearer lf_YOUR_TOKEN" }
    }
  }
}

Codex

export LANDINGFOLIO_TOKEN="lf_YOUR_TOKEN"
codex mcp add landingfolio --url https://mcp.landingfolio.com/mcp --bearer-token-env-var LANDINGFOLIO_TOKEN

VS Code

.vscode/mcp.json：

{
  "servers": {
    "landingfolio": {
      "type": "http",
      "url": "https://mcp.landingfolio.com/mcp",
      "headers": { "Authorization": "Bearer lf_YOUR_TOKEN" }
    }
  }
}

ツール

ツール	機能
list_categories	コンポーネントのカテゴリ（ヒーロー、料金表、お客様の声、機能紹介、CTA、フッターなど）を一覧表示します。
search_components	「3つの料金プランがあるダークな料金表」のような簡単な説明からセクションを検索します。
get_components	カテゴリまたは自分のコレクションから、最新のコンポーネントのスクリーンショットを取得します。
pick_components	気に入ったセクションを選べるビジュアルピッカーを開きます。
get_components_by_id	ピッカーから取得したコードを使って、選択したセクションを読み込みます。
get_inspiration_page	ギャラリーから、参考にして構築できるランディングページ全体を取得します。
get_og_images	OG／ソーシャル共有画像の例を取得します。
add_component	セクションを Landingfolio のコレクションに保存します。
list_my_components	コレクション内のセクションを一覧表示します。
delete_component	コレクションからセクションを削除します。

プロンプトの例

• 「SaaS のヒーローセクションを作成してください。インスピレーションとして Landingfolio を使ってください。」
• 「ダークな背景のお客様の声セクションを3つ探して、そのスタイルで今のものを作り直してください。」
• 「Landingfolio のピッカーを開いてください。気に入った料金表を選びます。」

プライバシー

プライバシーポリシー：https://www.landingfolio.com/legal/privacy-policy

サーバーが返すのは、公開されている Landingfolio ライブラリのスクリーンショットとメタデータのみです。無料プランを健全に保つため、ツールの呼び出しはアカウントごとに記録されます。プロジェクトのコード、プロンプト、ファイルが Landingfolio に送信されることはありません。

リンク

• ウェブサイト：https://www.landingfolio.com/mcp
• サポート：[email protected]