访问
免费。不需要账号、API key 或任何鉴权——贴上 URL 就能用。
让 AI 助手直接回答：这个控件叫什么。
CatchUI 的精选模式目录支持 Model Context Protocol。把一条 URL 添加到 Claude、ChatGPT、Cursor 或任意 MCP 客户端，AI 助手就能从 94 个精选 UI 模式里查出规范名称——中英文都行，并附上图鉴教学卡片链接。
https://catchui.com/api/mcp
一眼看懂
传输
Streamable HTTP（无状态 JSON-RPC），兼容当前所有 MCP 客户端。
数据
只读查询公开精选目录，不接触任何用户数据。
语言
查询与回答支持英文和简体中文，收录了真实的搜索措辞。
接入你的客户端
Claude Code
在终端运行一次：
claude mcp add --transport http catchui https://catchui.com/api/mcpclaude.ai / Claude Desktop
Settings → Connectors → Add custom connector → 粘贴 https://catchui.com/api/mcp。不需要授权步骤，因为根本不需要鉴权。
ChatGPT
Settings → Apps & Connectors → 打开 Developer mode → Create：服务器 URL 填 https://catchui.com/api/mcp，认证选「无」。
Cursor 及其他客户端
任何接受 Streamable HTTP URL 的客户端都可以。Cursor 的 ~/.cursor/mcp.json：
{ "mcpServers": { "catchui": {
"url": "https://catchui.com/api/mcp" } } }六个工具，一件事：叫对界面的名字
search_ui_patterns
把日常描述或问句——「底部的导航栏叫什么」、"the bar at the bottom of an app"——变成模式名称、定义、命中的问答和图鉴链接。
get_ui_pattern
单个模式的完整双语教学词条：定义、发音、中英文别名、常见问题与相关模式。
list_ui_patterns
按 family 浏览全部 94 个模式——导航、输入、操作、浮层、反馈、内容、数据与系统界面。
compare_ui_patterns
两到四个长得像的模式有什么区别——弹窗、气泡卡片还是底部抽屉，选项卡还是分段控制器，灵动岛还是刘海——并排对比，附图鉴里写好的对比问答。
get_ui_component_names
一个模式在 SwiftUI、UIKit、Jetpack Compose、安卓 Views、Flutter 和 HTML 里分别叫什么；也能从 UISegmentedControl 这类组件名反查其他平台的对应物。
get_implementation_prompt
一到六个模式的现成实现说明——位置、状态和无障碍要求——中英文可选，直接交给 Claude Code、Cursor 等 AI 编程工具。
可以这样问
- 「App 底部的导航栏叫什么？」
- 「三条横线的图标叫什么？」
- 「Toast 提示和弹窗的区别是什么？」
- 「列出 CatchUI 图鉴里所有的导航类模式。」
- 「分享菜单该用弹窗、气泡卡片还是底部抽屉？」
- 「UISegmentedControl 在 Flutter 里叫什么？」
- 「给我一段带筛选标签和分页的搜索框实现说明，用中文。」
它刻意不做的事
截图识别不通过 MCP 提供——它在网页应用 catchui.com 里运行。多模态助手可以自己「看」你的截图，用文字描述控件，再到目录里查出规范名称。
常见问题
CatchUI 的 MCP 服务是什么？
一个公开的 Model Context Protocol 端点：https://catchui.com/api/mcp。添加到 Claude、ChatGPT、Cursor 等 MCP 客户端后，AI 助手就能检索 CatchUI 的 94 个精选 UI 模式，回答「这个控件叫什么」，并附上定义与图鉴链接。
MCP 服务收费吗？
免费。目录工具不需要账号、API key 或任何鉴权。截图识别是网页应用的独立功能，不包含在 MCP 服务里。
哪些应用可以接入？
任何支持 Streamable HTTP 传输的 Model Context Protocol 客户端：Claude Code、claude.ai 与 Claude Desktop 的自定义连接器、ChatGPT 开发者模式连接器、Cursor 等。
提供哪些工具？
六个只读工具：search_ui_patterns 用中英文描述或问句查模式名称；get_ui_pattern 返回单个模式的完整双语词条；list_ui_patterns 按 family 浏览整个目录；compare_ui_patterns 比较两到四个容易混淆的模式；get_ui_component_names 给出模式在 SwiftUI、UIKit、Jetpack Compose、安卓 Views、Flutter 和 HTML 里的组件名，也能从 UISegmentedControl 这类组件名反查；get_implementation_prompt 返回可直接交给 AI 编程工具的中英文实现说明。
能通过 MCP 识别截图吗？
不能。截图识别在网页应用 catchui.com 里运行。多模态助手可以自己「看」截图，再用文字描述调用 search_ui_patterns 查出规范名称。
会访问我的数据吗？
不会。所有工具都是对公开精选目录的只读查询，无需登录，不接触任何用户账号、资料库或上传内容。
运营与联系
CatchUI 由香港团队运营。关于 MCP 服务的问题可发送至 support@catchui.com。
本页信息核实日期：2026-08-24。