Component Library · v2.0

UnoImobi · Storybook

Vitrine viva de todos os tokens, componentes e padrões do design system. Use como referência ao construir novas telas.

Cores

tokens.css · 22 cores
Marca
brand#5B3FE9
brand-deep#3A1FBF
accent#FF3D7F
hero#0F0F12
Semânticas
success#10B981
warning#F59E0B
danger#EF4444
info#3B82F6

Tipografia

Inter · pesos 400–800
Display L48 / 1.05 / -0.025em / 800
O CRM imobiliário
Display M32 / 1.1 / -0.02em / 700
Quatro pilares, um sistema
H124 / 1.2 / -0.015em / 700
Dashboard executivo
H218 / 1.3 / -0.01em / 600
Seção
Body14 / 1.55 / 0 / 400
Parágrafo padrão para texto corrido. Mantém legibilidade em blocos longos.
Caption11 / 1.4 / 0.08em / 700 UPPER
Caption / eyebrow
Mono13 / 1.5 · JetBrains
R$ 42.500,00 · 12,3% · 8.4 dias

Espaçamento

base 4px
4 · xs
8 · sm
12
16 · md
24 · lg
32 · xl
48 · 2xl

Marca

Brandmark · 3 tamanhos
UnoImobi UnoImobi UnoImobi

Botões

5 variantes · 3 tamanhos
<button class="btn btn-primary">Começar trial</button>

Chips & Badges

6 tons · com/sem dot
Neutral Brand Ativo Atenção Atraso Info

Inputs

text · select · textarea · estados
CPF inválido

Cards

Tintoretto · 304
Vila Olímpia · 110m²
Disponível VIP
Belvedere · 1102
Itaim · 145m² · 4 suítes
Reservado

KPI Cards

VGV no Mês
R$ 12,4M
↑ 23% vs mês anterior
Leads Quentes
47
↑ 8 hoje
Tempo Resposta
8,4 min
↓ 22% (melhor)

Avatars

4 tamanhos · gradient
RS HM JP MC

Toggles

Skeletons

loading states

Empty State

📋

Nenhum lead ainda

Quando começar a receber leads via WhatsApp, eles aparecem aqui.