DESIGN.md de marcas reais para agentes de IA
47 marcas reais. Pegamos o CSS público e transformamos em DESIGN.md.
Todas as marcas
47 / 47 brands
99 (Ride-hailing Brasil)
Design system do 99 (DiDi Global), líder em mobilidade urbana no Brasil. Amarelo primário…
AbacatePay
Design system público da AbacatePay, plataforma brasileira de pagamentos. A identidade com…
AmericaByDesign.gov
National Design Studio
Design system da iniciativa federal americana AmericaByDesign.gov. Estética editorial dark…
Atlassian Design System
Atlassian Design System
Design system oficial da Atlassian, empresa por trás do Jira, Confluence e Trello. Sistema…
Clerk
Design system da Clerk, plataforma de autenticação para desenvolvedores. Roxo primário (#6…
Conta Azul (LCAD)
LCAD
Design system da Conta Azul (LCAD), SaaS de gestão financeira para PMEs brasileiras. Azul…
DSGov (Padrão Digital de Governo)
DSGov
Design system oficial do Governo Federal Brasileiro usado em todos os serviços gov.br. Azu…
Embraer
Embraer DS
Design system da Embraer, fabricante brasileira de aeronaves. Azul navy primário (#0E1C59)…
Flame Design System (Santander)
Flame
Design system global do Santander nascido no Brasil em 2019 e lançado mundialmente em 2021…
FT (ft.ia.br)
Design system do FT, plataforma de ferramentas e experimentos em IA. Interface light-first…
Globo Codex (Design System)
Codex
Design system da Globo (Codex), maior conglomerado de mídia do Brasil. Vermelho primário (…
GOL Linhas Aéreas — Tangerina Design System
Tangerina
Design system da GOL Linhas Aéreas (Tangerina DS), companhia aérea low-cost brasileira. La…
Flora.ds — Grupo Boticário Design System
Flora.ds
Design system do Grupo Boticário (Flora.ds), maior conglomerado de beleza do Brasil. Verde…
Hotmart Cosmos
Cosmos
Design system da Hotmart (Cosmos), plataforma brasileira de produtos digitais e cursos onl…
iFood — Pomodoro Design System
Pomodoro
Design system do iFood (Pomodoro DS), maior plataforma de delivery do Brasil. Vermelho vib…
Inter (Inter&Co)
Design system do Inter, super app financeiro brasileiro com 43M+ clientes. Identidade lara…
Itaú Unibanco — Voxel Design System
Voxel
Design system do Itaú Unibanco, maior banco privado do Brasil. Laranja primário com azul m…
Loggi ELKE (Design System)
ELKE
Design system da Loggi (ELKE DS), plataforma brasileira de logística last-mile. Azul primá…
Magazine Luiza (Magalu)
Design system do Magazine Luiza (Magalu), líder em e-commerce marketplace no Brasil. Azul…
Mercado Livre
Andes
Design system do Mercado Livre, maior marketplace da América Latina. Identidade dual com a…
Mercado Bitcoin
Design system do Mercado Bitcoin, maior exchange de criptomoedas da América Latina. Interf…
Mintlify
Design system da Mintlify, plataforma de documentação para desenvolvedores. Verde brand qu…
Mondrian Design System (Claro)
Mondrian
Design system da Claro Brasil presente em 100% dos produtos web e 80% dos apps da operador…
Natura GaYa Design System
Gaya
Design system da Natura (Gaya DS), empresa brasileira de cosméticos. Paleta verde orgânica…
National Design Studio (NDS Core)
National Design Studio
Design system base do National Design Studio, iniciativa de design do governo federal dos…
NDStudio.gov
National Design Studio
Design minimalista governamental em grayscale com texturas grain, alto contraste preto/bra…
Nubank Marketing Site
Superfície de marketing do Nubank capturada do CSS público: violeta #820AD1 em reserva par…
Nubank NuDS (Nu Design System)
NuDS
Design system da Nubank, maior banco digital da América Latina com 118M+ clientes. Identid…
Nuvemshop-Nimbus-design-system
Nimbus
Design system da Nuvemshop (Nimbus), plataforma líder de e-commerce para PMEs na América L…
Nuxt
Design system do Nuxt, framework Vue.js fullstack. Verde elétrico (#00DC82) como cor primá…
olist design system
olist ds
Design system do ecossistema Olist com arquitetura de tokens em 3 níveis (base, theme, com…
Omarchy
Design system do Omarchy, framework de ferramentas para desenvolvimento Ruby on Rails. Int…
PicPay
Design system do PicPay, fintech brasileira com 66M+ clientes. Verde primário (#21C25E), a…
Pulso Design System (RD Saúde)
Pulso
Design system da RD Saúde (ex-RaiaDrogasil) com theming multi-marca real: Raia teal #006F8…
RD Station Tangram
Tangram
Design system da RD Station (Tangram), plataforma brasileira de automação de marketing. Az…
RealFood.gov
National Design Studio
Design system do RealFood.gov, portal federal de nutrição e saúde alimentar do governo dos…
Resend
Design system da Resend, plataforma de email para desenvolvedores. Estética dark minimal c…
Stone Pagamentos
Design system da Stone Pagamentos (StoneCo), plataforma de tecnologia financeira líder no…
TOTVS PO UI
PO UI
Design system da TOTVS (PO UI), maior empresa de software enterprise do Brasil. Accent rox…
TrumpRx.gov
National Design Studio
Design system governamental federal dos EUA com tema dark autoritativo, tipografia serifad…
UOL
Design system do UOL, maior portal de conteúdo da internet brasileira. Interface dark-firs…
Vercel — Geist Design System
Geist
Design system da Vercel com família tipográfica Geist. Estética preto/branco com precisão…
VoltAgent
Design system da VoltAgent, plataforma de engenharia de agentes IA. Verde elétrico (#00d99…
VTEX Admin UI
Admin UI
Design system intermediário da VTEX para o Admin v4 (2020-2024). Azul primário (#2953B2),…
VTEX Shoreline
Shoreline
Design system atual da VTEX para Admin moderno (2023-atual). Azul primário (#0366DD), acce…
VTEX Styleguide
Styleguide
Design system legacy da VTEX para a plataforma VTEX IO (2017-2021). Rebel Pink (#F71963) c…
Wellhub Yoga
Yoga
Design system do Wellhub (Yoga DS, antigo Gympass), plataforma corporativa de wellness. Si…
O que são Real Brands?
Real Brands são o design system de verdade. Não um estilo inspirado em. Pegamos o site da marca e extraímos o que está lá de fato — as cores exatas, as fontes que eles desenharam, o border-radius que alguém escolheu.
Como usar
Copie o arquivo
Escolha uma marca. Baixe o DESIGN.md dela. Jogue na raiz do seu projeto. Setup completo — um arquivo, zero config.
Dê o prompt pro agente
Peça pro Claude Code, Cursor ou qualquer agente montar um componente. Ele lê o DESIGN.md e aplica cores, espaçamento, tipografia e radius da marca automaticamente.
Entregue com fidelidade visual
O agente gera UI que respeita a linguagem visual da marca. Roxo Nubank (#820AD1), vermelho iFood, laranja Itaú — tudo no mesmo workflow.
Perguntas Frequentes
O que é um DESIGN.md de brand?
Um arquivo markdown estruturado que descreve o sistema visual de uma marca — cores, tipografia, espaçamento, radius, sombras — num formato que agentes de IA leem. Pense em design tokens, mas escritos pra LLMs em vez de build tools. O agente lê e gera UI como se a própria marca tivesse construído.
Posso usar o DESIGN.md da Stripe no meu projeto?
Sim, pra prototipação e referência. O DESIGN.md captura padrões visuais extraídos de CSS público — não assets proprietários. Use pra estudar como a Stripe estrutura espaçamento e cor, ou pra prototipar com um visual refinado antes de criar seu próprio sistema. Não publique como se fosse sua identidade.
As marcas brasileiras têm DESIGN.md oficial?
Não. Extraímos do CSS público — as mesmas folhas de estilo que seu browser baixa quando você acessa nubank.com.br ou ifood.com.br. Os tokens são reais (pegamos os hex values, font stacks e escalas de espaçamento), mas os arquivos não são endossados pelas marcas. São referências criadas pela comunidade.
Qual a diferença entre Library e Real Brands?
Library são design systems criados do zero pra agentes de IA — opinados, prontos pra ser a identidade visual do seu produto. Real Brands são engenharia reversa de empresas existentes. Use Library quando começa do zero. Use Real Brands quando precisa de referência, uma skin pra protótipo, ou quer estudar como uma marca de ponta estrutura seus tokens.
Este site não é afiliado, endossado ou patrocinado por nenhuma das marcas listadas. Os tokens de design apresentados foram extraídos exclusivamente de informações publicamente acessíveis (CSS visível em navegadores). Nenhum conteúdo protegido por direitos autorais é reproduzido. Se você é titular de uma marca e deseja solicitar remoção, consulte nossa Política de Privacidade — seção 9.