SVG Lab

Dá ao seu IA um motor de design: peça ao Claude, ChatGPT, Codex ou Cursor por telas de app, ícones e ilustrações, e o SVG Lab as cria como SVG limpo em uma tela, com espaçamento, alinhamento e tipografia resolvidos. Servidor remoto em https://svglab.app/mcp com login via OAuth, sem necessidade de chave.

Ver em svglab.appExperimente este MCPPatrocinado

Servidor MCP hospedado

npx add-mcp 'https://svglab.app/mcp'

Instala no Claude Code, Codex, Cursor e outros

Documentação

O servidor MCP do SVG Lab

O SVG Lab (svglab.app) possui um servidor MCP remoto, o SVG Lab MCP, que abriga o Design Engine do SVG Lab: o Design Engine para IA. A IA traz a ideia (conteúdo, paleta, direção); o SVG Lab garante a estrutura (espaçamento, alinhamento, dimensionamento, tipografia, geometria vetorial válida). Tudo o que ele cria é salvo nos projetos do usuário no SVG Lab como designs finalizados que exportam como SVG, PNG ou PDF. Ele roda nos servidores do SVG Lab, então nada precisa estar aberto no SVG Lab e não há código de pareamento.

O que ele cria

  • Telas de aplicativos e web com layout, componentes e tipografia reais
  • Ícones e conjuntos de ícones
  • Ilustrações e figuras humanas
  • Layouts com fotografia real
  • Gráficos
  • Slides, posts para redes sociais e pôsteres

Como conectar

URL do servidor: https://svglab.app/mcp (MCP remoto, HTTP streamable, login com OAuth 2.1).

  • Claude (claude.ai, Claude Desktop): Customize, Connectors, +, Add custom connector. Cole https://svglab.app/mcp,, pressione Add, depois Connect, faça login no SVG Lab e aprove.
  • Claude Code: Execute: claude mcp add --transport http --scope user svglab https://svglab.app/mcp. Depois abra /mcp no Claude Code e autentique.
  • ChatGPT: Settings, Security and login, ative o Developer mode. Depois Plugins, +, crie um aplicativo em modo desenvolvedor com a URL do servidor MCP https://svglab.app/mcp e OAuth, e faça login no SVG Lab.
  • Codex: No aplicativo Codex: Settings, Plugins, MCPs, Add, Connect to a custom MCP. Nomeie como SVG Lab, tipo Streamable HTTP, URL https://svglab.app/mcp, Save. Depois pressione Authenticate na linha do SVG Lab e aprove no navegador.
  • Cursor: Adicione em ~/.cursor/mcp.json: { "mcpServers": { "svglab": { "url": "https://svglab.app/mcp" } } }, depois faça login quando o Cursor solicitar.
  • OpenCode: Adicione em opencode.json sob "mcp": "svglab": { "type": "remote", "url": "https://svglab.app/mcp", "enabled": true }, depois execute: opencode mcp auth svglab.
  • Outros clientes MCP: Qualquer cliente que suporte MCP remoto via HTTP streamable com OAuth: URL do servidor https://svglab.app/mcp. Configuração completa para cada aplicativo: https://svglab.app/mcp-setup.

Configuração passo a passo para cada aplicativo (Claude, Claude Code, ChatGPT, Codex, Cursor, VS Code, OpenCode, Windsurf, Gemini CLI), com configurações prontas para copiar e colar, um prompt de teste e solução de problemas: https://svglab.app/mcp-setup (envie Accept: text/markdown para a versão em Markdown).

Acesso

Toda conta do SVG Lab recebe 100 solicitações gratuitas para testar o SVG Lab MCP, uma única vez, sem precisar preencher formulário. Depois disso, os planos Plus e Max incluem uma cota mensal de solicitações, e recargas adicionam solicitações que nunca expiram. Uma chamada de ferramenta equivale a uma solicitação, e chamadas que falham não são contabilizadas. Planos e recargas: https://svglab.app/billing. Plus custa US$ 20 por mês com 5.000 solicitações mensais; Max custa US$ 40 por mês com 15.000 solicitações mensais.

Mais: https://svglab.app/mcp-server. Planos: https://svglab.app/billing.