Começar

Dê um design system ao Windsurf

O agente Cascade do Windsurf é forte em código, mas não conhece a sua marca. Adicione o servidor MCP do Identity Forge à configuração do Windsurf para que ele possa navegar, aplicar e seguir um arquivo DESIGN.md e um conjunto de tokens reais.

Atualizado 2026-08-03

Por que o Windsurf precisa de um design system

O Cascade constrói funcionalidades de ponta a ponta, mas, como todo agente, ele redefine a estilização a cada interação: uma cor de destaque ligeiramente diferente aqui, um novo espaçamento ali, uma fonte nova na próxima tela. Um design system elimina as suposições: um conjunto de tokens semânticos e um DESIGN.md escrito que o Cascade segue, para que todo o app pareça um único produto em vez de dez prompts diferentes.

O Windsurf requer instalação manual (por enquanto)

O comando identityforge install --client … ainda não suporta o Windsurf. O Windsurf aceita o mesmo formato padrão de MCP, então adicione o servidor manualmente conforme mostrado abaixo. Os caminhos via CLI e shadcn funcionam sem MCP.

O kit que você irá instalar

Terrain Vivant

Live render

Rendered from the kit's actual tokens, fonts, and treatments

Terrain VivantOverview
Search anything⌘K
TV

Analytics

Revenue overview

See revenue and retention trends alongside account health.

Jan 1 to Jan 30, 2026
Overview
Analytics
Reports
Notifications

Active users

12.6k

2,491 new

+4%

MRR

$64.6k

Net of churn

+12%

Retention

94%

28-day window

+1%

NPS

54

1,204 replies

+6

Revenue

Last 12 months

$64.6k +18.2%

12m30d7d
JanFebMarAprMayJunJulAugSepOctNovDec

Acquisition

Goal completion

On track
78%of goal
Organic48%
Direct31%
Referral21%

Recent transactions

Latest activity across your workspace

View all
CustomerStatusDateAmount
AR

Alex Rivera

Founder & CEO

Paid2 min ago$1,999.00
MO

Mira Okonkwo

Head of Product

Pending1 hour ago$39.00
JF

Jonas Feld

Design Lead

Processing3 hours ago$299.00

Typography

Space Mono

Color system

28 semantic roles, light + dark

Agent outputs

DESIGN.md, CSS, Tailwind, shadcn

O kit gratuito Terrain Vivant, renderizado a partir de seus tokens reais: o sistema que o Cascade escreve no seu repositório.

Instale-o (configuração manual de MCP)

  1. 1

    Abra a configuração de MCP do Windsurf

    Abra o menu de configurações (chamado de Devin Settings desde que o Windsurf se juntou à Cognition), vá em Cascade > MCP Servers e escolha editar a configuração bruta (~/.codeium/windsurf/mcp_config.json).

  2. 2

    Adicione o servidor identityforge

    Cole a entrada abaixo no objeto mcpServers (mescle-a com quaisquer servidores já existentes).

    {
      "mcpServers": {
        "identityforge": {
          "command": "npx",
          "args": ["-y", "identityforge@latest", "mcp"]
        }
      }
    }
  3. 3

    Atualize os servidores MCP

    De volta ao painel de MCP do Cascade, atualize para que as ferramentas do identityforge sejam carregadas.

  4. 4

    Peça ao Cascade para aplicar o tema ao app

    Forneça o produto, o público e o mood; ele usará search_themes, get_design_md e apply_theme.

    Use Identity Forge to pick a clean, editorial theme for a
    recipe site, apply it, and follow the DESIGN.md.

O Windsurf agora faz parte do Devin

A Cognition adquiriu o Windsurf e sua documentação foi movida para docs.devin.ai, onde este fluxo de MCP está documentado para o agente Cascade (marcado lá como o agente legado). O caminho de configuração e o formato do mcpServers não mudaram, portanto, a configuração acima continua funcionando; espere que os rótulos da interface continuem mudando para a marca Devin.

Ou pule o MCP completamente

Como o Windsurf pode executar comandos de terminal, os caminhos agnósticos ao cliente funcionam sem qualquer edição de configuração: o Cascade (ou você) apenas executa um comando:

  1. 1

    Aplicação via CLI

    Escreve o DESIGN.md + um arquivo de tokens no diretório atual. Peça ao Cascade para ler o DESIGN.md e conectar os tokens.

    identityforge apply ambient-sage
  2. 2

    registro shadcn

    Instala as variáveis CSS do kit diretamente para projetos shadcn/ui.

    npx shadcn add https://identityforge.io/r/ambient-sage.json

O guia do Cursor cobre o mesmo fluxo de MCP com um comando de instalação suportado, e o guia fundamental vincula todas as ferramentas. Para entender a estrutura, leia o que é um DESIGN.md.

FAQ

Como dou um design system ao Windsurf?

Adicione o servidor MCP do Identity Forge em ~/.codeium/windsurf/mcp_config.json usando a entrada padrão mcpServers (comando npx, args -y identityforge@latest mcp), atualize os servidores MCP do Cascade e, em seguida, peça ao Cascade para escolher e aplicar um kit. Ou pule o MCP e execute identityforge apply <slug>.

Existe um comando install --client windsurf?

Ainda não. O comando de instalação da CLI suporta atualmente claude-code, cursor, codex, gemini, vscode, opencode e pi. Como o Windsurf utiliza o mesmo formato de MCP, você deve colar a configuração do servidor manualmente.

Posso evitar a edição de arquivos de configuração?

Sim. Execute identityforge apply <slug> para gravar o DESIGN.md e os tokens no diretório atual, ou npx shadcn add https://identityforge.io/r/<slug>.json para projetos shadcn/ui. Nenhuma dessas opções exige uma configuração de MCP.

Fontes

  • Cascade MCP - Devin Docs: A documentação do Windsurf agora está em docs.devin.ai; os servidores MCP para o agente Cascade são configurados em ~/.codeium/windsurf/mcp_config.json via Devin Settings > Cascade > MCP Servers.

Fontes

  • Cascade MCP - Devin Docs: A documentação do Windsurf agora está em docs.devin.ai; os servidores MCP para o agente Cascade são configurados em ~/.codeium/windsurf/mcp_config.json via Devin Settings > Cascade > MCP Servers.