v3 · linenclean sóbrio · branco neutro · tinta preta

Trabalho jurídico merece uma ferramenta sem firula.

Branco neutro frio, tinta preta como primário, sinais muted quando o estado pede. Inspirado em Linear, Notion e Vercel docs — pensado para quem prefere ler 60 publicações em segundos a admirar gradients.

Tokens de cor
20
5 surfaces · 5 ink · 4 borders · 6 sinais
Steps tipográficos
10
11px → 48px · só Inter
Radius máximo
10px
cards e sheets · zero brinquedo
Motion ceiling
150ms
sem bounce, sem parallax
01 · Princípios

Cinco regras que não negociam

Se um pixel viola qualquer uma delas, o pixel está errado. Não a regra.

§ 01
Tinta preta é o primary

Não há accent cromático. CTA é #09090b. Decisões importantes pesam pela hierarquia, não pela cor.

§ 02
Sinais muted são raros

Warn, danger, success, info aparecem só quando o estado pede. Tons baixos, sem saturação festiva.

§ 03
Densidade enterprise

Linha de 36px. Padding contido. O usuário escaneia 60 itens em segundos — não vê hero shadow em cada card.

§ 04
Sem decoração — só estrutura

Hairlines, grids invisíveis, radius pequeno. Se um pixel existe sem função, sai.

§ 05
Performance é UX

Motion 100–150ms. Zero bounce, zero parallax. O produto parece rápido porque é rápido.

02 · Paleta

Branco neutro, tinta preta, sinais muted

Sem accent cromático. O primary é #09090b puro. Os sinais aparecem em tons baixos, com tints suaves, só quando o estado pede.

Canvas + superfícies
canvas
#ffffff
fundo da janela
surface
#ffffff
cartões em foco
surface-2
#fafafa
sidebar · superfície secundária
surface-3
#f4f4f5
cabeçalho de tabela
surface-hover
#f0f0f1
feedback de linha
Hierarquia de texto · ink
ink
#09090b
corpo · primary tone
ink-2
#18181b
subtítulos · valores
ink-muted
#52525b
descrição padrão
ink-subtle
#71717a
caption · metadado
ink-disabled
#a1a1aa
texto inativo
Borders · hairlines
border-faint
#f0f0f1
grade discreta
border
#e4e4e7
borda padrão
border-strong
#d4d4d8
borda enfática
border-ink
#18181b
foco
Primary · tinta preta
primary
#09090b
CTA · ícone ativo
primary-hover
#27272a
hover
primary-pressed
#3f3f46
pressionado
Sinais muted · use só quando o estado pede
4 sinais · cada um carrega significado
warn
#92660e
prazo ≤ 5 dias
danger
#b91c1c
vence hoje · vencido
success
#15803d
arquivado · favorável
info
#1e40af
publicado · evento neutro
03 · Tipografia

Só Inter. JetBrains Mono para números e código.

Escala compacta: 11–48px. Hierarquia por tamanho e peso, nunca por cor. Sem display serif, sem espetáculo.

token
spec
família
amostra
xs
11/500
mono
CAPTION · LABEL
sm
12/400
sans
metadado · timestamp
base
13/400
sans
Linha de tabela · texto de corpo padrão
md
14/400
sans
Despacho proferido em 22 de abril de 2026.
lg
15/500
sans
Carlos Eduardo Almeida — OAB/SP 312.987
xl
18/600
sans
Publicações de hoje · TJSP
2xl
22/600
sans
Embargos de declaração
3xl
28/600
sans
Vossa Excelência foi intimada
4xl
36/600
sans
Diário de Justiça Eletrônico
5xl
48/600
sans
Banca Lopes & Sá
Tipografia aplicada · realce de termo

Intima-se a parte autora, na pessoa de seu advogado Carlos Eduardo Almeida, OAB/SP 312.987, para, no prazo de 15 (quinze) dias, manifestar-se sobre os documentos juntados às fls. 142/158, sob pena de preclusão.

termo monitoradomatch em "carlos eduardo almeida"
04 · Componentes

Biblioteca enxuta, opinionada

Cada componente carrega a mesma sobriedade: borda hairline, radius pequeno, sem decoração.

Botões · 4 variantes × 3 tamanhos
componente

Primary é tinta sólida, sempre #09090b. Não há accent cromático.

Chips, status, sinais muted
componente
NOVOPRAZO ATIVOVENCE HOJEFAVORÁVELPUBLICADO
prazo ativovence hojearquivadocapturadosem movimento
Inputs · select · keyboard
componente
Tribunal de Justiça de São Paulo
⌘ K
Prazo · hierarquia por urgência
componente
2vencido · contestação0hoje · manifestação3dias · recurso12dias · memoriais

Danger só com ≤ 1 dia ou vencido. Warn com ≤ 5 dias. Acima disso, neutro.

KPI · sem hero treatment
componente
Inbox
47
12 com termo
Prazos ≤ 5 dias
8
priorize
Vence hoje
2
risco
Tabs · segmented
componente
Tribunal:
Linha de publicação · densidade enterprise
componente
08:421003456-22.2026.8.26.0100TJSPDespacho5dias
08:440028144-09.2025.5.02.0042TRT2Sentença15dias
09:015004221-83.2024.4.03.6100TRF3Intimação0hoje
Bloco de citação · sem flourish
componente
“Defere-se o pedido de tutela provisória de urgência, determinando-se à requerida que se abstenha de promover qualquer cobrança, sob pena de multa diária de R$ 1.000,00.”
juiz · 2ª vara cível·1003456-22.2026.8.26.0100
05 · Léxico

Vocabulário visual do escritório

Não usamos "active", "pending", "success". Usamos as palavras que o advogado escreve no despacho.

termo
visual
quando usar
Pendente
NOVO
publicação capturada, ainda não classificada.
Ciente
CIENTE
advogado abriu, leu e tomou ciência. Conta para auditoria.
Em prazo
PRAZO ATIVO
há prazo computável. Warn se ≤ 5 dias.
Vence hoje
VENCE HOJE
prazo expira no dia. Danger sempre.
Vencido
VENCIDO
prazo expirou sem manifestação.
Favorável
FAVORÁVEL
sentença favorável, transitada em julgado.
Publicado
PUBLICADO
documento veio do diário oficial.
Arquivado
ARQUIVADO
sem ação requerida. Sai do inbox.
06 · Geometria & Motion

Pouco arredondado, pouco tempo, pouca sombra

Radius contido. Motion 100–150ms. Shadows quase imperceptíveis. O produto é rápido porque é rápido — não porque mexe muito.

Radius · ≤ 10px
xs · 4px
chip · botão pequeno
sm · 6px
botão · input · select
md · 8px
card · panel
lg · 10px
modal · sheet
Motion · 100–150ms
dur-1
hover state · color shift
100ms
dur-2
disclosure · sheet aberta
150ms
ease
standard easing
cubic-bezier(0.4, 0, 0.2, 1)
Shadows · quase imperceptíveis
shadow-xs
segmented active
shadow-sm
card lift sutil
shadow-md
menu · popover
Pronta para ver o sistema em uso?
Cinco telas que cobrem o ciclo completo do dia: captura, leitura, classificação, ação e configuração.
Ver aplicado
ogmma · jurídico·v3 · linen
white · ink · muted signals
proposta · 2026-04-29