Design systems de mídia e entretenimento
Sistemas de design extraídos de sites de notícias, revistas, editoras, streaming e entretenimento. A tipografia lidera: fontes de manchete, assinaturas de autor e grades de matérias, com a cor usada com moderação em seções e chamadas para ação.
2 exemplos de DESIGN.md nesta categoria, de The Onion e WIRED. Extraídos das páginas públicas de cada site. Não são diretrizes oficiais de marca. Ainda não conhece o formato? Leia o que é um DESIGN.md.
The Onion
O The Onion é um sistema de design de jornal satírico digitalizado: manchetes em gótico condensado e pesado, na cor preta, com um verde-floresta característico (#006b3a) usado nos rótulos de seção, nos selos de tendência e nos CTAs, tudo sobre uma tela branca e cinza-claro sem adornos. A tipografia é a principal ferramenta de design: grotescas condensadas e semicondensadas do Adobe Fonts (tablet-gothic, rocky-condensed) dominam os títulos, enquanto utopia-std-caption cuida do texto corrido. O layout é denso em informação, com grades de cards compactas, separadores de artigo com borda inferior e raios de borda quase nulos nos elementos estruturais. A elevação é mínima, com apenas algumas sombras sutis em sobreposições.
WIRED
WIRED é um sistema de design monocromático de alto contraste, orientado pela editorial, construído em torno de um sistema tipográfico proprietário (Breve Text, WIRED Mono, WiredDisplay, Apercu) e de uma paleta cromática quase inexistente. O preto (#000000) domina com 2961 ocorrências, ancorando textos, bordas, ícones e estados interativos. O branco (#ffffff) fornece a superfície principal. A cor de destaque aparece com moderação: apenas #057dbc surge como azul da marca, nos botões de assinatura. O layout usa uma grade de matérias em múltiplas colunas bem estruturada, com espaçamento base apertado de 8px, superfícies planas sem sombras e raio de borda mínimo (4px no padrão). A tipografia é o principal diferencial: o corpo editorial usa Breve Text em 19px, os rótulos de seção usam WIRED Mono em maiúsculas com espaçamento entre letras, e os títulos de destaque usam WiredDisplay. A estética geral é autoritária, densa em informação e voltada, antes de tudo, à leitura.
Não encontrou o site que procura?
Cole qualquer URL para gerar o DESIGN.md de qualquer site. Cores, tipografia, espaçamento e tokens, prontos para o seu fluxo de trabalho com IA.