6.8 KiB
name, description
| name | description |
|---|---|
| Heritage Editorial | Quiet luxury editorial para uma assessoria de eventos humana, precisa e atemporal. |
Design System: Heritage Editorial
Overview
Creative North Star: "Heritage Editorial"
Amare deve parecer uma publicação de alta qualidade dedicada a encontros memoráveis: serena, criteriosa e tátil, sem parecer distante. Quiet luxury vem de composição, tipografia, ritmo e materialidade; nunca de ornamento acumulado. Marca une sensibilidade humana e precisão operacional.
Sistema usa papel quente, oliva botânico, fotografia curada e grandes pausas editoriais. Coração facetado da identidade funciona como selo, assinatura ou marca de capítulo. Conteúdo factual e imagens reais devem ocupar centro; interface recua para dar autoridade ao trabalho.
Key Characteristics:
- Editorial minimalista com assimetria controlada.
- Paleta orgânica, baixa excitação e contraste AA.
- EB Garamond como voz única, do display ao formulário.
- Superfícies planas, linhas finas e cantos retos.
- Fotografia ampla, tratada com saturação contida.
- Movimento lento e discreto, sempre dispensável.
Colors
Paleta relaciona papel, tinta e vegetação. Cores comprometem regiões inteiras; não aparecem como acentos dispersos.
Primary
- Oliva Herança (
#556B2F): marca, botões primários, iconografia e estados interativos de maior ênfase. - Oliva Profundo (
#3E5219): títulos, áreas de contraste e hover do primário.
Secondary
- Sálvia Silenciosa (
#8B9D77): metadados, divisórias, legendas e acentos de baixa ênfase.
Neutral
- Papel Marfim (
#FBF9F4): fundo dominante e base editorial. - Papel Profundo (
#F0EEE9): blocos tonais, formulários e pausas entre capítulos. - Papel Arquivo (
#E4E2DD): estados passivos e camadas secundárias. - Tinta Oliva (
#1B1C19): texto de leitura e contraste principal. - Tinta Suave (
#5D6155): texto secundário e apoio. - Linha Botânica (
#C5C8B8): bordas, regras e divisórias. - Branco de Prova (
#FFFFFF): texto sobre oliva e superfícies estritamente funcionais.
The Paper Field Rule. Papel Marfim ou Oliva Profundo deve dominar cada região; cartões brancos soltos não formam composição.
The Honest Contrast Rule. Texto longo usa Tinta Oliva sobre papel claro. Sálvia nunca substitui cor de leitura quando contraste cair abaixo de WCAG AA.
Typography
Display Font: EB Garamond, Garamond, Georgia, serif Body Font: EB Garamond, Garamond, Georgia, serif Label Font: EB Garamond, Garamond, Georgia, serif
Character: Uma única família cria continuidade de livro e identidade. Contraste vem de escala, peso, caixa e espaçamento, não de mistura tipográfica.
Hierarchy
- Display (500,
clamp(3rem, 7.7vw, 5.875rem), 0.94): mensagens de abertura; tracking negativo e largura curta. - Headline (500,
clamp(2.375rem, 5.2vw, 4rem), 1.02): títulos de capítulo e chamadas editoriais. - Title (500,
clamp(1.875rem, 4vw, 2.875rem), 1.08): serviços, casos e agrupamentos. - Body Large (400,
clamp(1.25rem, 2vw, 1.5rem), 1.45): argumentos centrais e introduções, limitados a cerca de 34rem. - Body (400,
1rem–1.125rem, 1.5–1.6): leitura, descrições e conteúdo funcional. - Label (600,
0.75rem–0.875rem, 0.08em–0.14em, uppercase): navegação, metadados, campos e índices.
The Single Voice Rule. EB Garamond ocupa todas as funções. Não introduzir sans-serif como atalho para modernidade.
The Locked Display Rule. Displays usam tracking apertado, entrelinhas compactas e no máximo 10–13 caracteres por linha quando a composição permitir.
Layout
Estrutura base usa grade central de 12 colunas no desktop e 4 no mobile, com largura máxima de 1120px. Gutter responde entre 20px e 64px; margens largas funcionam como material premium, não espaço desperdiçado.
Composições editoriais alternam colunas assimétricas, imagens em diferentes proporções e blocos de leitura curtos. Formulários, listas e navegação mantêm alinhamento estrito. Ritmo estrutural usa múltiplos de 8px; ajustes tipográficos usam 4px.
Desktop aceita spreads, conteúdo deslocado e relações 5/7 ou 4/5. Mobile lineariza ordem sem esconder conteúdo essencial, mantém CTA acessível e troca spreads por sequências verticais. Fotografia pode ocupar viewport amplo, desde que texto e ação permaneçam legíveis.
The Editorial Rhythm Rule. Seções alternam imagem, texto, densidade e silêncio; repetição de grades idênticas por toda página é proibida.
Elevation & Depth
Sistema é plano e tátil. Profundidade nasce de campos tonais, sobreposição editorial, recorte fotográfico e regras de 1px. Sombras não aparecem em conteúdo regular. Overlays estritamente funcionais podem usar difusão ampla com oliva em baixa opacidade; nunca sombra curta e cinza de cartão SaaS.
Cabeçalho pode usar Papel Marfim translúcido e desfoque discreto quando sobreposto ao conteúdo. Estado hover muda tom, linha ou deslocamento mínimo; não eleva cartões.
The Tonal Layer Rule. Troca de papel precede qualquer sombra como mecanismo de hierarquia.
Shapes
Linguagem é arquitetônica e afiada: botões, inputs, contêineres e imagens usam cantos retos (0px). Bordas finas e cortes precisos remetem a papelaria, impressão e blocos editoriais.
Círculos ficam reservados para retratos ou indicadores que exigem forma circular. Coração facetado da Amare é geometria proprietária; não autoriza polígonos decorativos genéricos no restante da interface.
The Sharp Edge Rule. Arredondamento casual, pills e cartões flutuantes quebram identidade.
Do's and Don'ts
Do:
- Do usar espaço em branco como mecanismo de foco e cadência.
- Do tratar fotografia como conteúdo editorial amplo, com saturação e contraste contidos.
- Do preservar coração facetado como assinatura reconhecível, com respiro proporcional.
- Do usar linhas de 1px, campos tonais e alinhamento para construir hierarquia.
- Do manter estados de foco visíveis, navegação por teclado e movimento reduzido.
- Do marcar imagens demonstrativas e substituir por acervo autorizado antes da publicação.
Don't:
- Don't usar gradientes, glassmorphism, brilhos, sombras de cartão ou superfícies glossy.
- Don't arredondar botões, inputs, imagens ou contêineres.
- Don't misturar famílias tipográficas sem redefinição explícita da identidade.
- Don't transformar oliva em pequenos acentos sobre uma página dominada por branco puro.
- Don't inventar cases, números, credenciais, clientes ou prova corporativa.
- Don't usar decoração de casamento genérica como corações, flores desenhadas ou dourado ornamental.