MCP 接入

8pt MCP 让 Claude Code、Cursor、Codex、Trae 等编辑器直接搜索并取用 8pt 的组件、模板、主题、图标和 Skill。

#准备

MCP 地址是 https://8pt.dev/api/mcp，使用 Streamable HTTP。每个请求带上 Authorization: Bearer <你的 API Key>。API Key 在设置 › API Key里创建，需要 Builder 方案。

终端

claude mcp add --transport http 8pt https://8pt.dev/api/mcp \
  --header "Authorization: Bearer <你的 API Key>"

写入 ~/.cursor/mcp.json：

~/.cursor/mcp.json

{
  "mcpServers": {
    "8pt": {
      "url": "https://8pt.dev/api/mcp",
      "headers": { "Authorization": "Bearer <你的 API Key>" }
    }
  }
}

写入 ~/.codex/config.toml，并在环境变量里设置 EIGHTPT_API_KEY：

~/.codex/config.toml

[mcp_servers.8pt]
url = "https://8pt.dev/api/mcp"
bearer_token_env_var = "EIGHTPT_API_KEY"

Trae 在「设置 › MCP › 手动添加」里粘贴 JSON；其他支持 Streamable HTTP 的客户端同理：

mcp.json

{
  "mcpServers": {
    "8pt": {
      "url": "https://8pt.dev/api/mcp",
      "headers": { "Authorization": "Bearer <你的 8pt API Key>" }
    }
  }
}

工具	作用
`search_components`	按中文或英文描述搜索组件，返回 slug、名称、分类和简介。query 留空返回全部。
`get_component`	取回一个组件的完整接入提示词，含 HTML、CSS、JS 源码和接入步骤。
`list_templates`	列出全部整页模板及其区块。
`get_template`	取回模板的搭建提示词和完整 HTML 源码。
`list_skills`	列出全部 Skill 及其权限。
`get_skill`	取回一个 Skill 的全部文件（SKILL.md 及引用的文件）。
`get_theme`	取回主题的 CSS 变量；slug 留空列出全部主题。
`search_icons`	按英文名搜索图标，返回 24px、stroke=currentColor 的 SVG。
`submit_component`	把写好的原生组件（HTML、CSS、可选 JS）提交到这个账户的投稿，进入人工审核。

所有工具都是只读的。接入后直接在对话里提需求，例如「用 8pt 找一个定价切换组件放进首页」。