Impact — Sistema de Design
eco00 · design systems

Impact

Sistema de design para superfícies públicas e materiais externos. Estética editorial — quente, tipograficamente densa, com caráter visual forte.

Quando usar

Contextos de aplicação

Sites públicos

Landing pages, vitrines de produto, portais institucionais acessados por usuários anônimos.

Materiais externos

PDFs, apresentações, documentos enviados a clientes e parceiros.

Comunicação editorial

Artigos, publicações, conteúdo com hierarquia tipográfica acentuada.

Identidade de marca

Qualquer superfície onde a identidade visual do ecossistema precisa estar presente.

Não usar em

Interfaces de retaguarda, painéis operacionais, back-offices, documentação técnica interna.

Tokens

Cor e superfície
Token
Uso
--paper · #f5f0e8
Fundo principal — papel levemente amarelado
--ink · #0d0d0d
Texto principal
--ink-soft · #2a2520
Texto de corpo — levemente suavizado
--accent · #c8401a
Destaque — vermelho-tijolo. Links, ênfase, marca
--muted · #6b6560
Texto secundário, labels, metadados
--border · #d4cec4
Bordas e divisores

Tipografia

Escala e famílias
--serif · DM Serif Display — títulos, display, hero
Título de impacto
com peso editorial
--serif itálico — citações, destaques
Texto em itálico com a serifada — citações, epígrafes, ênfase de nível editorial.
--sans · DM Sans — corpo, interface
Texto de corpo em DM Sans. Peso 300 para leitura longa, 400 para interface, 500 para ênfase leve, 600 para labels e botões.
--mono · DM Mono — código, labels técnicos, metadados
version: 1.0.0 · status: active · deploy: 2026-07-06

Hierarquia

Títulos e displays em DM Serif Display. Corpo e interface em DM Sans. Código, timestamps, labels de sistema e qualquer valor técnico em DM Mono. Não misturar serifada e sans no mesmo nível hierárquico.