プロトタイプ · プレビュー版：公式レジストリのすべてのサーバーを掲載し、30分ごとに同期しています。レビューとアカウント機能は今後のステップで始まります。
PopNx MCPAIを使う人のためのMCPサーバー · やさしい言葉で解説
初心者モード オン
配色システムに合わせるライトダーク
言語ไทยEnglish中文日本語한국어EspañolDeutsch
☰ メニュー設定
初心者モード オン
配色システムに合わせるライトダーク
言語ไทยEnglish中文日本語한국어EspañolDeutsch

Inspo

作者：Nutlopeバージョン 0.1.16i★ –iパソコンでもクラウドでも
レジストリ名io.github.Nutlope/inspo

インストール

概要

作者による説明（英語の原文）

Real production websites for coding agents: palettes, fonts, fold autopsies and reference JSX.

PopNx MCPの3つの柱

この3つを1つのスコアにまとめることはしません。意見、測定、人気はそれぞれ別のものだからです。

できること

このサーバーのやさしい解説はまだ書いていません。以下はレジストリから読み取った事実です。

  • 接続方法: パソコンでもクラウドでも
  • トランスポート: stdio, Streamable HTTP
  • カテゴリ: その他
  • 入力が必要なもの：TOGETHER_API_KEY

インストール

使っているAIアプリを選んで、設定をコピーしてください。

インストールの前に

  • 基本チェック：1項目中1項目に合格
  • 作者のサーバーで動きます。あなたが頼んだ内容は、作者のサーバーを通ります。
  • 自分で入力するもの： TOGETHER_API_KEY, INSPO_CATALOGUE_URL, INSPO_PROFILE, INSPO_IMAGES, INSPO_MAX_TOKENS

「秘密」と表示された値は、あなたのアカウントの鍵です。絶対に人に教えたり、チャットに貼り付けたりしないでください。

必要なもの

  • クラウドで動くインストール不要。インターネット経由でつながります
  • npmNode.jsのインストール（npxコマンドに必要）

どのアプリを使っていますか？

上でアプリを選んでください。選んだアプリを覚えておくので、次からはボタンに「…にインストール」と表示されます。

ウェブ、デスクトップ、モバイルのClaudeで使えます：

  1. Settings → Connectors を開く
  2. Add custom connector を押す
  3. 下のアドレスを貼り付けて Add を押す
  4. サインインを求められたら、作者のサービスにサインインする
SettingsConnectors1+ Add2https://…3
https://inspomcp.dev/api/mcp

または、パソコンで動かす

Claude Desktop → Settings → Developer → Edit Config を開き、claude_desktop_config.json にこれを貼り付けます

{
  "mcpServers": {
    "inspo": {
      "command": "npx",
      "args": [
        "-y",
        "inspo-mcp"
      ],
      "env": {
        "TOGETHER_API_KEY": "your-value",
        "INSPO_CATALOGUE_URL": "your-value",
        "INSPO_PROFILE": "your-value",
        "INSPO_IMAGES": "your-value",
        "INSPO_MAX_TOKENS": "your-value"
      }
    }
  }
}

ターミナルでこれを実行します

claude mcp add --transport http inspo https://inspomcp.dev/api/mcp

または、パソコンで動かす

claude mcp add inspo --env TOGETHER_API_KEY=your-value --env INSPO_CATALOGUE_URL=your-value --env INSPO_PROFILE=your-value --env INSPO_IMAGES=your-value --env INSPO_MAX_TOKENS=your-value -- npx -y inspo-mcp

動かす前に、空欄の値を入力してください。

Cursorで開く

または、設定を自分でコピーする

プロジェクトの .cursor/mcp.json、または ~/.cursor/mcp.json に貼り付けます

{
  "mcpServers": {
    "inspo": {
      "url": "https://inspomcp.dev/api/mcp"
    }
  }
}

または、パソコンで動かす

Cursorで開く

または、設定を自分でコピーする

プロジェクトの .cursor/mcp.json、または ~/.cursor/mcp.json に貼り付けます

{
  "mcpServers": {
    "inspo": {
      "command": "npx",
      "args": [
        "-y",
        "inspo-mcp"
      ],
      "env": {
        "TOGETHER_API_KEY": "your-value",
        "INSPO_CATALOGUE_URL": "your-value",
        "INSPO_PROFILE": "your-value",
        "INSPO_IMAGES": "your-value",
        "INSPO_MAX_TOKENS": "your-value"
      }
    }
  }
}

ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。

VS Codeで開く

または、設定を自分でコピーする

プロジェクトの .vscode/mcp.json に貼り付けます

{
  "servers": {
    "inspo": {
      "type": "http",
      "url": "https://inspomcp.dev/api/mcp"
    }
  }
}

または、パソコンで動かす

VS Codeで開く

または、設定を自分でコピーする

プロジェクトの .vscode/mcp.json に貼り付けます

{
  "servers": {
    "inspo": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "inspo-mcp"
      ],
      "env": {
        "TOGETHER_API_KEY": "your-value",
        "INSPO_CATALOGUE_URL": "your-value",
        "INSPO_PROFILE": "your-value",
        "INSPO_IMAGES": "your-value",
        "INSPO_MAX_TOKENS": "your-value"
      }
    }
  }
}

ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。

ChatGPTがつなげるのは、インターネット上のサーバーだけです：

  1. ウェブ版のChatGPTを開き → Settings → Connectors (Apps)
  2. Create または Add を押す（プランによっては、先に Advanced で Developer mode をオンにする必要があります）
  3. 下のアドレスを貼り付け、名前を付けて保存する
  4. サインインを求められたら、作者のサービスにサインインする
SettingsConnectors1+ Create2https://…3
https://inspomcp.dev/api/mcp

メニューの名前は、プランや時期によって少し違うことがあります。

選んだアプリは、この端末のCookieに保存されます。アカウントは不要です。

自分で入力する値

  • TOGETHER_API_KEY 秘密 env
    Optional. Enables query-embedding semantic search; everything else works without it.
  • INSPO_CATALOGUE_URL env
    Optional. Point at a self-hosted catalogue instead of the public CDN.
  • INSPO_PROFILE env
    Optional. 'lite' or 'full' tool surface (auto-detected per client by default).
  • INSPO_IMAGES env
    Optional. 'thumbs' or 'none' - whether tool results inline thumbnail image blocks.
  • INSPO_MAX_TOKENS env
    Optional. Token ceiling per tool response (300 to 200000); trims lower-ranked results first.

この設定は、作者のレジストリ登録情報から作成しています。READMEと違う場合は、READMEに従ってください。

できること

このサーバーのツール一覧はまだ読み取っていません。エンドポイントは順番にチェックしています。

基本チェックi

誰でも見られる情報をチェックしており、コードは読んでいません。当てはまらない項目は数に入れていません。 · 2026年11月7日にチェック

  • ✓ 合格

    作者とリポジトリが一致

    レジストリ名は、リポジトリを所有するGitHubアカウント Nutlope で確認済みです

  • … 未チェック

    今もメンテナンスされている

    このリポジトリはまだGitHubから読み取っていません

  • … 未チェック

    ライセンスがある

    このリポジトリはまだGitHubから読み取っていません

  • … 未チェック

    エンドポイントが応答する

    まだチェックしていません。エンドポイントは順番にチェックしています

  • … 未チェック

    OAuthでサインイン

    まだチェックしていません。エンドポイントは順番にチェックしています

  • … 未チェック

    ツールの説明に隠れた指示がない

    まだチェックしていません。エンドポイントをチェックするときにツール一覧を読み取ります

その他のほかのサーバーとの比較i

  • このカテゴリのほかの32700件のうち0%よりスターが多い
  • このカテゴリのほかの32700件のうち43%より最近レジストリに公開
  • 基本チェックの結果が、このカテゴリのほかの32700件のうち100%と同じかそれ以上

レジストリでこのカテゴリにある有効なすべてのサーバーと比較しています。スターは、公開者がリポジトリの所有者である場合だけ数えます。

よくある質問

Inspoは安全ですか？

当てはまる基本チェック1項目のうち1項目に合格しました。コードは読んでいません。キーやトークンを追加する前に、サーバーがどんなアクセスを求めているかを確認し、必要な権限だけを持つキーを使ってください。

どんなキーやコードが必要ですか？

入力が必要なもの：TOGETHER_API_KEY

パソコンで動きますか、それともクラウドですか？

どちらでも使えます。パソコンにインストールしても、クラウド版につないでもかまいません。

今もメンテナンスされていますか？

GitHubリポジトリの最終更新は–、最新バージョン（0.1.16）がレジストリに届いたのは2 か月前です。

どのアプリで使えますか？

Claude Desktop、Claude Code、Cursor、VS CodeなどのMCP対応アプリで使えます。URLでつながるので、リモートMCPサーバーに対応したアプリ（開発者モードのChatGPTなど）でも使えます。

代わりに使えるものは？

同じカテゴリには：Spec Driven Development, Remote Desktop Commander, Agent Data Tools: Utilities

代わりの候補

同じカテゴリで、ほかの作者が作ったサーバー。スターの多い順。

カードの見方：★ GitHubスターi3つの柱：レビュー · チェック · 利用状況i更新＝最新バージョンをレジストリに公開した日i

Remote Desktop Commander

作者：desktop-commander

Remote Desktop Commander: use files, terminal and processes on your own computers from any AI app.

クラウドで動く★ 211一昨日更新
インストール

作者のREADME

READMEを開く

作者のリポジトリから書かれたとおりにコピーしたものです。PopNx MCPは内容を確認・推奨していません。HTML、画像、スクリプトは取り除いています。リンクはこのサイトの外へ移動します。

Inspo

Real production websites your coding agent can study, over MCP, before it writes UI. inspomcp.dev

With and without

Same brief, same model, no design skill on either run. The only difference: the page on the right was built with Inspo MCP on the session.

That gap is the product. Agents have tools but not taste, and the open web already holds every reference they need: Inspo assembles, tags, and addresses it.

What's inside

  • 2,320 pages across 832 real sites, each captured on desktop and mobile, with traced palettes, real fonts, detected tech, and a fold-by-fold autopsy on every page.
  • 68 canonical reference components (heroes, pricing, footers, navs, and more), each demonstrating one named macrostructure, with copy-pasteable JSX.
  • A DESIGN.md for every site, extracted from its DOM: semantic palette roles, type ramp, spacing scale, CSS variables, container width.

Fifteen tools expose all of it; recommend(brief) composes most of them into one call. The full tool table lives in apps/mcp/README.md.

Tech stack

  • TypeScript MCP server with two transports: stdio via npm, and Streamable HTTP served by the site's own Vercel deployment. No database at query time; the catalogue ships as a static seed.
  • Next.js 16 + Tailwind v4 gallery: the archive browser and the curator dashboard.
  • Playwright capture worker: desktop and mobile shots, palette, type ramp and CSS variable extraction, tag and autopsy passes via Together AI.
  • Together AI embeddings behind semantic search and find_similar.
  • A smoke harness that boots the server in-process and exercises the core tools.

Cloning & running

  1. One command, any client: npx -y inspo-mcp install (detects Claude Code, Cursor, Codex, VS Code, Windsurf, Zed, Claude Desktop and writes the config; --dry-run shows the plan)
  2. Or point a client at the hosted endpoint yourself: claude mcp add --transport http inspo https://inspomcp.dev/api/mcp
  3. Or clone: git clone https://github.com/Nutlope/inspo.git && cd inspo && pnpm install
  4. Gallery: pnpm dev, then open localhost:3000
  5. Dev loop: pnpm --filter @inspo/mcp test

Per-client snippets (Cursor, Windsurf, Zed, Claude Desktop) are on the MCP page; the self-host runbook is DEPLOY.md.

Roadmap

  • show the desktop and mobile capture side by side on every screen page
  • backfill component crops so find_components returns a crop for every hit
  • paginate the list tools instead of capping them
  • re-shoot the mobile set at retina scale
  • Accounts and paywalls are skipped on purpose: the archive is more useful free.

Want a site in the archive? Append it to apps/worker/src/seed-urls.ts and open a PR. The bar: does it make the archive better for someone building a website?

Security

Every tool is read-only. The one path that touches the outside world - get_design_system(live:true), which supplements thin captured tokens from the screen's own source - passes each URL and redirect through an SSRF guard: public named hosts only, ports 80 and 443, byte-capped body, no JS execution. The hosted endpoint logs tool name, success and duration per call, never IPs or query text.

MIT, copyright Together AI and contributors. The screenshots remain the work of their designers: every screen credits and links its source, and takedowns are honoured at /dmca.

PopNxに聞く