从真实网站提取设计系统，并通过 MCP 把设计规范交给 AI 编程 Agent。 | Extract design systems from real websites and give AI coding agents grounded specifications through MCP.
Setup
Choose your client, copy the config, then fill in any required environment variables.
Local
claude mcp add opendesign -- npx -y opendesign-mcp~/.codex/config.toml
[mcp_servers.opendesign]
command = "npx"
args = ["-y", "opendesign-mcp"]
# codex mcp add opendesign -- npx -y opendesign-mcp~/.cursor/mcp.json
{
"mcpServers": {
"opendesign": {
"command": "npx",
"args": [
"-y",
"opendesign-mcp"
]
}
}
}.vscode/mcp.json
{
"servers": {
"opendesign": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"opendesign-mcp"
]
}
}
}~/.gemini/settings.json
{
"mcpServers": {
"opendesign": {
"command": "npx",
"args": [
"-y",
"opendesign-mcp"
]
}
}
}claude_desktop_config.json
{
"mcpServers": {
"opendesign": {
"command": "npx",
"args": [
"-y",
"opendesign-mcp"
]
}
}
}.trae/mcp.json
{
"mcpServers": {
"opendesign": {
"command": "npx",
"args": [
"-y",
"opendesign-mcp"
]
}
}
}Remote
claude mcp add --transport http opendesign https://opendesign.cc/mcp/http~/.codex/config.toml
[mcp_servers.opendesign]
url = "https://opendesign.cc/mcp/http"
# codex mcp add opendesign --url https://opendesign.cc/mcp/http~/.cursor/mcp.json
{
"mcpServers": {
"opendesign": {
"url": "https://opendesign.cc/mcp/http"
}
}
}.vscode/mcp.json
{
"servers": {
"opendesign": {
"type": "http",
"url": "https://opendesign.cc/mcp/http"
}
}
}~/.gemini/settings.json
{
"mcpServers": {
"opendesign": {
"httpUrl": "https://opendesign.cc/mcp/http"
}
}
}claude_desktop_config.json · Customize › Connectors › Add custom connector
{
"mcpServers": {
"opendesign": {
"command": "npx",
"args": [
"-y",
"mcp-remote",
"https://opendesign.cc/mcp/http"
]
}
}
}.trae/mcp.json
{
"mcpServers": {
"opendesign": {
"url": "https://opendesign.cc/mcp/http"
}
}
}