Começar

Dê um design system ao Gemini CLI

O sistema de contexto do Gemini CLI é o mais literal de qualquer agente: ele percorre uma hierarquia de arquivos GEMINI.md, concatena-os e envia o resultado com cada prompt. Sem heurísticas de correspondência, sem carregamento sob demanda. Essa simplicidade é uma vantagem para o trabalho de design, pois um contrato de design é exatamente o tipo de coisa que você deseja que seja carregada todas as vezes.

Atualizado 2026-08-04

Como o Gemini CLI realmente carrega o contexto

Três níveis, concatenados em ordem a cada prompt. O arquivo ~/.gemini/GEMINI.md armazena seus padrões globais. A partir do diretório de execução, a CLI sobe até a raiz do projeto (a pasta com .git), coletando arquivos GEMINI.md do projeto. Diretórios de componentes podem adicionar os seus próprios para contexto local. O comando /memory show exibe o resultado final literalmente, /memory refresh refaz a varredura após edições, e @file.md dentro de qualquer GEMINI.md importa outro arquivo, funcionando tanto com caminhos relativos quanto absolutos.

Não há correspondência de relevância neste pipeline: tudo o que é encontrado é sempre carregado. Isso tem dois lados. Notas exploratórias longas não pertencem ao GEMINI.md, mas um contrato de design sim, porque o design se aplica a cada requisição de UI e a falha de *não* carregá-lo é a derivação que você está aqui para corrigir.

O cenário de falha sem um contrato

Peça ao Gemini CLI para criar telas em algumas sessões sem um contrato escrito e ele decidirá a linguagem visual a cada vez: uma nova cor de destaque, espaçamentos ligeiramente diferentes, outra combinação de fontes. Não porque o modelo seja fraco, mas porque nada persiste suas escolhas anteriores. O padrão estatístico para o qual ele retorna é o mesmo que todo modelo compartilha, e é por isso que apps de IA não guiados convergem para a mesma aparência.

Consistency check · Ad-hoc colors

The same plan card, built two ways in Ambient Sage.

Drifting system

Pricing

Starter$19/mo

Everything a small team needs to ship a branded UI.

Consistent system

Pricing

Starter$19/mo

Everything a small team needs to ship a branded UI.

What to notice: Esquerda: componentes de sessões separadas e não guiadas. Direita: as mesmas requisições com os tokens de um kit carregados via GEMINI.md.

A configuração

  1. 1

    Instale os tokens de um kit

    Variáveis CSS semânticas ou um tema Tailwind no repositório, para que os nomes dos tokens sejam resolvidos em valores reais que o código possa usar.

  2. 2

    Adicione o DESIGN.md na raiz do projeto

    O sistema escrito completo: o que cada função de cor significa, a escala tipográfica, espaçamentos, motivos e as regras do que não fazer. Este é o arquivo que mantém a identidade entre as sessões.

  3. 3

    Importe-o do GEMINI.md do projeto

    Uma seção, consistindo basicamente em uma linha de importação. A hierarquia faz o resto: cada prompt no projeto agora carrega o contrato.

  4. 4

    Verifique com /memory show

    Execute-o uma vez e leia a saída. Se o conteúdo do DESIGN.md não estiver lá, o caminho de importação está errado, e nenhum prompt corrigirá o que nunca foi carregado.

# Design system

@DESIGN.md

- Use only the semantic tokens defined above; never a literal hex
  value or an ad-hoc font.
- Type, spacing, and radii come from the scales in DESIGN.md.
- If a needed value has no token, stop and ask.
A seção de design de um GEMINI.md de projeto.

Mantenha o arquivo global fora disso

Contratos de design são, por natureza, por projeto. Coloque a importação no GEMINI.md do projeto, e não em ~/.gemini/GEMINI.md, caso contrário, todo repositório que você abrir herdará a marca de um único produto.

Opcional: MCP, para que o Gemini possa aplicar kits por conta própria

O Gemini CLI suporta servidores MCP via ~/.gemini/settings.json. Com o servidor do Identity Forge registrado, o agente pode pesquisar no catálogo do kit, ler sistemas de tokens completos e escrever o DESIGN.md e os tokens no repositório via tool call, em vez de você montar os arquivos manualmente:

npx --yes identityforge@latest install --client gemini
Registra o servidor MCP para o Gemini CLI.

Um DESIGN.md completo, pronto para importar

Cada kit do Identity Forge exporta o arquivo do qual esta configuração depende: 28 tokens semânticos em light e dark, tipografia, espaçamento, motifs e regras para o agente.

O Gemini CLI possui um recurso de design system?

No native one. Its GEMINI.md context hierarchy is the mechanism: files load on every prompt, and the @file.md import syntax pulls a DESIGN.md straight into that context. Paired with installed tokens, it covers what a native feature would.

Onde colocar o GEMINI.md?

Três níveis: ~/.gemini/GEMINI.md globalmente, um GEMINI.md no (ou acima do) seu diretório de trabalho para o projeto, e arquivos opcionais por subdiretório. Todos os arquivos encontrados são concatenados nessa ordem em cada prompt. As regras de design devem ficar no nível do projeto.

Como verifico se as regras de design foram realmente carregadas?

/memory show prints the exact concatenated context sent to the model; your DESIGN.md content should appear in it. After editing files, /memory refresh re-scans. This one check catches nearly every broken setup, usually a wrong import path.

Por que não colar todo o design system diretamente no GEMINI.md?

It works, but it forks the truth: the system then lives in two places once you also need it for other agents or human docs. Keeping DESIGN.md as the single artifact and importing it with @DESIGN.md means every tool, and every teammate, reads the same file.

O Gemini CLI pode aplicar um kit do Identity Forge?

Sim. Sem o MCP, o comando de CLI identityforge apply <kit> grava o DESIGN.md e os tokens no repositório. Com o servidor MCP registrado em ~/.gemini/settings.json, o Gemini consegue pesquisar, visualizar e aplicar kits por conta própria durante uma sessão.