Vev MCP Server

Vev ships a Model Context Protocol server, so AI assistants and agents — Claude, ChatGPT, Claude Code, or anything else that speaks MCP — can find your Vev projects, generate embed code, and export project content section by section.

https://api.vev.design/v2/mcp

The server is stateless Streamable HTTP: JSON-RPC 2.0 over POST, one JSON response per request. All tools are read-only and require the list:project scope.

Connecting

Claude (claude.ai and Claude Desktop)

Go to Settings → Connectors → Add custom connector and paste the server URL. Claude discovers the OAuth endpoints automatically and opens the Vev consent screen — log in, review the access, and click Allow access.

Claude Code

claude mcp add --transport http vev https://api.vev.design/v2/mcp

The OAuth flow starts automatically on first use. Alternatively, skip OAuth entirely with an API key:

claude mcp add --transport http vev https://api.vev.design/v2/mcp \
  --header "x-vev-key: [your-key]"

Any other client

Two authentication options:

• OAuth 2.1 — authorization code + PKCE (S256), with dynamic client registration. Discovery documents are at https://api.vev.design/.well-known/oauth-authorization-server and https://api.vev.design/.well-known/oauth-protected-resource/v2/mcp. The access token you receive is a Vev API key — it stays valid until revoked from your user profile.
• API key — create a key with the list:project scope (see Authentication) and send it as an x-vev-key header or as Authorization: Bearer [your-key].

Test the connection:

curl -X POST https://api.vev.design/v2/mcp \
  --header "x-vev-key: [your-key]" \
  --header "Content-Type: application/json" \
  --data '{"jsonrpc":"2.0","id":1,"method":"tools/list"}'

Tools

Only projects the authenticated user can access are ever returned.

find_projects

Look up projects three ways, combinable in one call:

• ids — project keys to fetch directly (max 20)
• search — free-text search across titles, descriptions, tags, and page text
• url — a published site URL, an editor URL, or an embed URL, resolved to its project
• accountKey — restrict search to an account (defaults to your own), limit — max results (default 10)

Each result includes the project key, title, publish state, a thumbnail URL, and an editor link.

get_embed_code

Takes a projectKey (and optionally pageKey — defaults to the index page) plus the embed options fill, shadowdom, containerMode, target, and templateVariables. Returns the ready-to-paste script tag, the embed URL, the project's page list, and a readiness check: the project must be published to an embed destination (enable Get embed code in the editor's publish dialog) before the embed resolves.

Tip: containerMode: true rewrites the design's media queries to container queries, so the embed responds to the width of its slot instead of the viewport — the right choice when embedding a Vev page as a section inside another layout.

get_project_sections

Exports everything needed to rebuild a project's content elsewhere. For every section of every page (filter with pageKey or sectionKeys):

• a screenshot URL (1200px wide, generated when a project version is saved)
• the element tree with text content as HTML
• the section's real per-breakpoint CSS (includeCss, default on)
• every image, video, shape (inline SVG), and font the section uses, with URLs and dimensions
• interactions and animation keyframes (includeInteractions, default on) — animations are CSS-property keyframes with WAAPI-style timing, and triggers reference elements by their key, which is also the element's DOM id
• captured rendered HTML where available (includeHtml), and the raw Vev content models for full fidelity (includeModels)

Project-level, the export carries the resolved design theme (colors, text styles, spacing, radii), the breakpoint definitions, and the project color swatches.

Calls are capped at 40 sections — narrow with pageKey or sectionKeys for larger projects.