How do I install Inspo?

Copy the http config for Cursor, Claude Desktop, Claude Code, or VS Code on this page. It uses the publisher's install, not a PlugMCP proxy.

Does Inspo need an API key?

The publisher lists these environment variables: TOGETHER_API_KEY, INSPO_CATALOGUE_URL, INSPO_PROFILE, INSPO_IMAGES, INSPO_MAX_TOKENS.

When was Inspo last checked?

Last checked 2026-10-16. Real production websites for coding agents: palettes, fonts, fold autopsies and reference JSX.

Inspo MCP server

Add this server

The publisher's own URL. Not a PlugMCP endpoint.

Server URL

https://inspomcp.dev/api/mcp

Credentials from the publisher

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

Provider

Add in Claude

Claude opens with the name and URL filled in. You still confirm it there.

Claude Code

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

Run in a terminal.

Claude Desktop

{
  "mcpServers": {
    "io.github.nutlope-inspo": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "https://inspomcp.dev/api/mcp"
      ]
    }
  }
}

claude_desktop_config.json

Step-by-step: add this in Claude

Remote URL or a command on your machine? How the two installs differ

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

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)
Or point a client at the hosted endpoint yourself: claude mcp add --transport http inspo https://inspomcp.dev/api/mcp
Or clone: git clone https://github.com/Nutlope/inspo.git && cd inspo && pnpm install
Gallery: pnpm dev, then open localhost:3000
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.

Add this server

The publisher's own URL. Not a PlugMCP endpoint.

Server URL

https://inspomcp.dev/api/mcp

Credentials from the publisher

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

Provider

Add in Claude

Claude opens with the name and URL filled in. You still confirm it there.

Claude Code

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

Run in a terminal.

Claude Desktop

{
  "mcpServers": {
    "io.github.nutlope-inspo": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "https://inspomcp.dev/api/mcp"
      ]
    }
  }
}

claude_desktop_config.json

Step-by-step: add this in Claude

Remote URL or a command on your machine? How the two installs differ

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

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)
Or point a client at the hosted endpoint yourself: claude mcp add --transport http inspo https://inspomcp.dev/api/mcp
Or clone: git clone https://github.com/Nutlope/inspo.git && cd inspo && pnpm install
Gallery: pnpm dev, then open localhost:3000
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

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.

Inspo

Add this server

Host a copy with our keys and logs.

Related MCP

Related skills

What's inside

Tech stack

Cloning & running

Roadmap

Security

Inspo

Add this server

Host a copy with our keys and logs.

Related MCP

Related skills

What's inside

Tech stack

Cloning & running

Roadmap

Security