I'm your specialized design systems assistant. Ask me about components, tokens, patterns, and best practices.
Setup
Choose your client, copy the config, then fill in any required environment variables.
Local
claude mcp add design-systems -- npx mcp-remote https://design-systems-mcp.southleft-llc.workers.dev/mcp~/.codex/config.toml
[mcp_servers.design-systems]
command = "npx"
args = ["mcp-remote", "https://design-systems-mcp.southleft-llc.workers.dev/mcp"]
# codex mcp add design-systems -- npx mcp-remote https://design-systems-mcp.southleft-llc.workers.dev/mcp~/.cursor/mcp.json
{
"mcpServers": {
"design-systems": {
"command": "npx",
"args": [
"mcp-remote",
"https://design-systems-mcp.southleft-llc.workers.dev/mcp"
]
}
}
}.vscode/mcp.json
{
"servers": {
"design-systems": {
"type": "stdio",
"command": "npx",
"args": [
"mcp-remote",
"https://design-systems-mcp.southleft-llc.workers.dev/mcp"
]
}
}
}~/.gemini/settings.json
{
"mcpServers": {
"design-systems": {
"command": "npx",
"args": [
"mcp-remote",
"https://design-systems-mcp.southleft-llc.workers.dev/mcp"
]
}
}
}claude_desktop_config.json
{
"mcpServers": {
"design-systems": {
"command": "npx",
"args": [
"mcp-remote",
"https://design-systems-mcp.southleft-llc.workers.dev/mcp"
]
}
}
}.trae/mcp.json
{
"mcpServers": {
"design-systems": {
"command": "npx",
"args": [
"mcp-remote",
"https://design-systems-mcp.southleft-llc.workers.dev/mcp"
]
}
}
}Remote
claude mcp add --transport http design-systems https://design-systems-mcp.southleft.com/mcp~/.codex/config.toml
[mcp_servers.design-systems]
url = "https://design-systems-mcp.southleft.com/mcp"
# codex mcp add design-systems --url https://design-systems-mcp.southleft.com/mcp~/.cursor/mcp.json
{
"mcpServers": {
"design-systems": {
"url": "https://design-systems-mcp.southleft.com/mcp"
}
}
}.vscode/mcp.json
{
"servers": {
"design-systems": {
"type": "http",
"url": "https://design-systems-mcp.southleft.com/mcp"
}
}
}~/.gemini/settings.json
{
"mcpServers": {
"design-systems": {
"httpUrl": "https://design-systems-mcp.southleft.com/mcp"
}
}
}claude_desktop_config.json · Customize › Connectors › Add custom connector
{
"mcpServers": {
"design-systems": {
"command": "npx",
"args": [
"-y",
"mcp-remote",
"https://design-systems-mcp.southleft.com/mcp"
]
}
}
}.trae/mcp.json
{
"mcpServers": {
"design-systems": {
"url": "https://design-systems-mcp.southleft.com/mcp"
}
}
}