← bit-system / fundamentos

Tipografia

Apenas duas vozes. VT323 pixel para todos os headlines, CTAs e números-assinatura. Inconsolata monoespaçada para corpo, UI, labels e qualquer texto não-display. Sem sans-serif no sistema.

As duas famílias

display + corpo · nada além disso
Display · Headlines · CTAs · Números
Aa
VT323 Regular · 1 weight
Fonte pixel monoespaçada — a voz da marca. Use sempre em caixa alta. Ideal para títulos gigantes, números-assinatura (ROAS, CPA, %), CTAs e badges. Nunca em corpo de texto.
ABC123!?@$★→
Body · UI · Labels · Qualquer coisa que não seja display
Aa
Inconsolata 400 · 500 · 600 · 700
Monoespaçada com ótima leitura entre 14–20px. Reforça a estética tech-retrô sem comprometer clareza. Use em textos corridos, descrições, labels de UI, navegação, formulários e captions.
ABC123!?@$→•

Pesos · Inconsolata

VT323 só tem regular
Aa
400 · Regular
Aa
500 · Medium
Aa
600 · SemiBold
Aa
700 · Bold

Escala tipográfica

tokens, tamanhos e amostras
Role
Fonte
Weight
Size
Line-height
Token
Sample
Display
VT323
Regular
96px
100%
$display
INSERT COIN
Headline 1
VT323
Regular
64px
100%
$headline-01
PRESS START
Headline 2
VT323
Regular
48px
100%
$headline-02
GAME OVER? NO.
Headline 3
Inconsolata
Bold
32px
40px
$headline-03
Level up seu funil
Headline 4
Inconsolata
SemiBold
24px
32px
$headline-04
Aperte START pra jogar
Headline 5
Inconsolata
SemiBold
20px
28px
$headline-05
Checkpoint salvo
Body 1
Inconsolata
Regular
18px
26px
$body-01
Estratégia, mídia paga e conteúdo num só combo.
Body 2
Inconsolata
Regular
16px
24px
$body-02
Relatórios mensais no seu WhatsApp, sem planilha feia.
Body 3
Inconsolata
Regular
14px
20px
$body-03
Texto auxiliar pra contextos discretos, captions ou notas.
Caption
Inconsolata
SemiBold
14px
20px
$caption
LABEL · 01 · BIT SYSTEM
Overline
Inconsolata
Medium
12px
16px
$overline
NEW HIGH SCORE

Specimens

como soa em peças reais
01 · HERO
Press Start
to level up

Performance, criativo e mídia paga rodando 24/7. Sem placar mentiroso, sem relatório-placebo. Só resultado que o CFO entende.

02 · CTA
+320%
de roas

Novo high score desbloqueado pela nossa co-op com a Loja X. E a campanha mal saiu do modo fácil.

03 · SECTION
Co-op
mode.

A gente joga junto com você. Estratégia compartilhada, métricas transparentes, ajuste de rota semanal.

04 · QUOTE

"Trocamos a última agência pela 2P e, em 90 dias, nosso CPA caiu 42%."

— Marcelo Ribas, CMO · Acme Logística

Regras de aplicação

hierarquia e pareamento

✓ Faça

  • VT323 sempre em caixa alta. Ele foi desenhado pra isso.
  • Pare a escala de VT323 em 48px pra baixo — a partir dali, Inconsolata Bold.
  • Use Inconsolata Medium/SemiBold pra destacar palavras em corrido.
  • Line-height travado em múltiplos de 4 (grid base).

✗ Evite

  • VT323 em parágrafo. Vira ilegível abaixo de 24px.
  • Misturar sans-serif (Poppins, Inter etc.) — o sistema não tem.
  • Itálico em VT323. A fonte não tem e a simulação oblíqua fica torta.
  • VT323 em minúsculas ou case misto.