Sobre o projeto

## O que é design-md-hub é um repositório open-source com 120 sistemas de design de marcas, cada um capturado como um único arquivo `DESIGN.md` em texto puro que agentes de codificação por IA podem ler. Cada especificação foi reverse engineerada a partir do site de produção da marca, então as fontes, valores hex, logotipos e textos vêm da fonte real, não de suposições. Valores que não puderam ser confirmados no site ativo foram omitidos. ## O que um DESIGN.md contém - Paletas de cores e tokens semânticos - Escala tipográfica e escolhas de fontes - Padrões de componentes e variantes - Espaçamento, sombras e border radius - Princípios de layout e comportamento responsivo - Tom, diretrizes e prós/dons Cada pasta de marca também inclui um `preview.html` autossuficiente que abre diretamente no navegador, sem etapa de build, permitindo inspecionar a identidade visual. ## Fluxo descrito no README 1. O site ao vivo da marca é buscado (HTML, CSS, fontes) e tokens reais são extraídos. 2. Esses tokens se tornam uma especificação `DESIGN.md` em texto puro. 3. Um `preview.html` correspondente demonstra a identidade no navegador. 4. Um agente de codificação lê o `DESIGN.md` para gerar UI na voz daquela marca. ## Cobertura A coleção abrange developer tools, produtos de IA/LLM, ferramentas de design, fintech, analytics, observability, apps de produtividade, serviços de auth, plataformas de dados, commerce e automação. Exemplos incluem GitHub, Figma, Cursor, Linear, Stripe, Vercel, Supabase, Notion, Docker, MongoDB, Cloudflare, OpenAI, Claude, Mistral AI, ElevenLabs, Tailwind CSS, shadcn/ui, n8n, Zapier, Grafana e muitos outros. Um site gallery ao vivo está linkado no README para navegar pelas previews. ## Como usar 1. Escolha um `DESIGN.md` da coleção listada. 2. Copie-o para a raiz do seu projeto. 3. Instrua seu agente de codificação a seguir o DESIGN.md na raiz do projeto. 4. Gere componentes, páginas ou apps inteiros com styling consistente. Sem paywalls, signups ou API keys necessários; contribuições são aceitas pelo CONTRIBUTING.md do repositório. ## Avisos O README afirma que estas specs são referências não oficiais, construídas para educação e prototyping, reverse engineeradas a partir de sites públicos de marcas, e não são endossadas nem afiliadas às marcas. Trademarks e logos permanecem com seus proprietários. O projeto é licenciado sob MIT.