# designmd.app

> Referência aberta de arquivos DESIGN.md documentados para agentes de IA.

## Resumo do Site

designmd.app é uma biblioteca de referência open-source de arquivos DESIGN.md — um formato Markdown com YAML front matter que combina design tokens legíveis por máquina (cores, tipografia, espaçamento, rounded, componentes) com prosa de racional de design legível por humanos. O formato é mantido pelo Google e introduzido pelo Google Stitch em março de 2026. Agentes de IA leem o arquivo na raiz do projeto e aplicam regras visuais de forma consistente em toda UI gerada.

## Seções Principais

- https://designmd.app.br/library — Coleção de DESIGN.md documentados por vertical e estilo, prontos para copiar
- https://designmd.app.br/brands — DESIGN.md de marcas reais extraídos de fontes públicas (Nubank, iFood, Santander, Itaú, Stripe, Apple, etc.)
- https://designmd.app.br/o-que-e-design-md — Referência técnica completa sobre o formato e especificação oficial
- https://designmd.app.br/integrations — Integrações DESIGN.md para agentes de IA: Claude Code, Cursor, Kiro, Windsurf, Google Stitch
- https://designmd.app.br/guides — Guias de setup por agente com configuração passo a passo
- https://designmd.app.br/for — Padrões DESIGN.md por vertical (SaaS, e-commerce, fintech, etc.)
- https://designmd.app.br/blog — Artigos técnicos sobre DESIGN.md, design systems para IA, vibe coding
- https://designmd.app.br/skills — Skills de agente de IA (módulos SKILL.md) por ft.ia.br
- https://designmd.app.br/developers — Documentação da API, quickstart, autenticação e sandbox
- https://designmd.app.br/faq — Perguntas frequentes sobre DESIGN.md
- https://designmd.app.br/about — Quem mantém o projeto e como contribuir
- https://designmd.app.br/contact — Entre em contato com a equipe

## Informações-Chave para Agentes de IA

- **Formato**: Markdown + YAML front matter (tokens legíveis por máquina)
- **Seções**: Overview, Colors, Typography, Layout, Elevation & Depth, Shapes, Components, Do's and Don'ts
- **Tipos de token**: Color (#hex sRGB), Dimension (px/em/rem), Typography (object), Token Reference ({path.to.token})
- **Validação**: npx @google/design.md lint
- **Export**: Converte para Tailwind theme config e DTCG tokens.json (W3C)
- **Compatibilidade**: Qualquer agente que leia arquivos do repositório (Claude Code, Cursor, Kiro, Windsurf, Stitch)
- **Propósito**: Contexto visual persistente que previne UI inconsistente gerada por IA

## Recursos Relacionados

- github.com/google-labs-code/design.md — Especificação oficial
- skill.dev.br — Marketplace de skills de agente de IA
- ft.ia.br — Autor

## Documentação Estendida

- https://designmd.app.br/llms.txt — Resumo completo do site para LLMs
- https://designmd.app.br/llms-full.txt — Versão completa com catálogo de toda a biblioteca
