Skip to content
Menu

Docs · MCP

Connect Codex, Claude Code and Cursor to Fieldbook MCP

Set up your coding agent to find UI components, retrieve framework source and follow installation guidance through the Fieldbook MCP server.

Follow the agent building guide

Endpoint

https://fieldbook.lizardi.mx/api/mcp

Authentication

Every request carries a bearer token. Two kinds work:

  • API key (available now)

    Create a key in your dashboard and send it as Authorization: Bearer fb_live_…. Keys are shown once; only a hash is stored.

  • Clerk OAuth (when configured)

    OAuth-capable clients discover the authorization server from /.well-known/oauth-protected-resource and authenticate interactively. No manual key needed.

Connect

Set FIELDBOOK_TOKEN in the environment used to launch your editor or agent. The examples reference that variable; do not commit a real API key to your project.

Codex

codex mcp add fieldbook --url https://fieldbook.lizardi.mx/api/mcp --bearer-token-env-var FIELDBOOK_TOKEN

Claude Code · .mcp.json

{
  "mcpServers": {
    "fieldbook": {
      "type": "http",
      "url": "https://fieldbook.lizardi.mx/api/mcp",
      "headers": {
        "Authorization": "Bearer ${FIELDBOOK_TOKEN}"
      }
    }
  }
}

Grok Build · ~/.grok/config.toml

[mcp_servers.fieldbook]
url = "https://fieldbook.lizardi.mx/api/mcp"
headers = { "Authorization" = "Bearer ${FIELDBOOK_TOKEN}" }

Cursor · .cursor/mcp.json

{
  "mcpServers": {
    "fieldbook": {
      "url": "https://fieldbook.lizardi.mx/api/mcp",
      "headers": {
        "Authorization": "Bearer ${env:FIELDBOOK_TOKEN}"
      }
    }
  }
}

For clients that require OAuth, use the deployed authorization flow only when it is configured and verified. The API-key examples above apply to clients that support bearer headers.

MCP Inspector. Run the inspector, enter the endpoint, and set an Authorization: Bearer header to explore the tools interactively.

MCP Inspector

npx @modelcontextprotocol/inspector

Tools

The v2 rules expose level, scopes, clusters, fineWhen and observes. suggest_alternatives resolves retired rule IDs to successors where available. score_page accepts page or section scope and intent entries with ruleId and reason. Its cluster-v2 report includes flags with status and points, reviews, hardFails, clusters, declared and changes. Catalog readings retain their own rulesetVersion. Request bodies are limited to 256 KiB; use url for larger pages. Oversize requests return HTTP 413 with a JSON-RPC error.

Metered tools spend credits from your monthly allowance (the owner plan is unmetered). Everything else is free and rate-limited per account.

Point at a plate. Every component carries a four-digit plate number, printed on its card and its page. Browse the catalog, pick what you want, and hand the number to your agent: every component tool accepts plate in place of slug, and spellings like 0412, #412 or FB-0412 resolve too. Each component page has a copy button for the handle and for a ready-to-paste prompt.

  • search_componentsFree

    query?, category?, framework?, access?, maxSlopScore?, limit (max 25)

    Search the catalog for previews, access tiers and tested frameworks. Installation commands are listed for open components, and for member components when your plan includes them.

  • get_component1 credit

    slug or plate, framework (default react)

    Retrieve a component's source and demo for the selected framework, with props, dependencies and installation guidance. Member components are included with an active Pro plan; other accounts receive membership_required and spend no credits.

  • list_frameworksFree

    slug or plate

    Which frameworks a component ships in, and which ports are still pending.

  • get_install_commandFree

    slug or plate, framework (default react)

    Installation command, registry URL and components.json snippet for a component. Member components are included with an active Pro plan.

  • get_design_guidanceFree

    query?, domain?, stack?, productType?, limit?

    Search the anti-slop guidance corpus.

  • generate_design_system2 credits

    productType, keywords?, stack?, variance?, motion?, density?

    Generate a non-generic design system: palette, type, layout, motion, UX rules, checklist.

  • get_slop_rulesFree

    category?, level?, scope?

    Retrieve Fieldbook’s design guidelines for coding agents.

  • get_font_guidanceFree

    role?, family?, name?

    How each recommended typeface looks and behaves, with tested pairings and the principles behind them.

  • suggest_alternativesFree

    ruleId

    Retrieve suggested alternatives for a design finding.

  • score_pageFree

    html? | url?, scope? (page | section), intent? [{ ruleId, reason }]

    Score a page against the ruleset (URL fetched behind an SSRF guard).

Registry

Install open components directly or through the components.json registry below. Member components are included with an active Pro plan.

components.json

{
  "registries": {
    "@fieldbook": {
      "url": "https://fieldbook.lizardi.mx/r/react/{name}.json",
      "headers": {
        "Authorization": "Bearer ${FIELDBOOK_TOKEN}"
      }
    }
  }
}

A machine-readable index of the site and these endpoints lives at /llms.txt.