DESIGN_SYSTEM

VERSÃO 1.0 // MANIFESTO BRUTALISTA EM CÓDIGO

01_PALETA_DE_CORES TOKENS
PRIMARY_ACCENT

#FF2E2E

var(--color-primary)
STARK_BLACK

#1A1A1A

var(--color-text)
CONCRETE_GRAY

#E5E5E5

var(--color-bg)
02_TIPOGRAFIA SCALES
Display_Heading_01 (Anton)

ESTRUTURA_CRUA

Sub_Heading_02 (Anton)

FUNÇÃO_SOBRE_FORMA

Body_Text (Roboto Mono)

O design brutalista digital não pede desculpas pela sua natureza técnica. O uso de fontes mono-espaçadas reforça a conexão com o terminal e o código-fonte original.

03_COMPONENTES ATOMIC
Buttons
<button class="btn btn-primary">...</button>
Input_Fields
<input type="text" class="input" />
04_GRID_SISTEMA STRUCTURE

REGRAS DE ESPAÇAMENTO:

  • Uso obrigatório de bordas sólidas de 4px para separação de seções.
  • Padding padrão de 32px (var--space-md) para containers de conteúdo.
  • Sombras ("Hard Shadows") de 8px sem desfoque (blur: 0).