6.0 Design System
Charts
Visualizacoes de dados construidas com CSS puro e SVG. Sem dependencias externas, prontas para interfaces dark-first.
5 Sections · V1.0 · 2026
01
Bar Chart
Barras verticais com alturas proporcionais e cores da marca.
Receita Mensal
Valores em milhares (R$)
65k
Jan
78k
Fev
52k
Mar
90k
Abr
85k
Mai
72k
Jun
95k
Jul
68k
Ago
82k
Set
88k
Out
76k
Nov
91k
Dez
chart / bar / brand-gradient
02
Donut Chart
Grafico de rosca com conic-gradient e legenda lateral.
Distribuicao de Projetos
100% Total
Sites 42%
Marketing 28%
Sistemas 18%
Outros 12%
chart / donut / conic-gradient
03
Line Chart
Grafico de linhas com SVG polyline e area fill.
Tendencia de Crescimento
Ultimos 12 meses JanFevMarAbrMaiJunJulAgoSetOutNovDez
chart / line / svg polyline + area gradient
04
Progress Bars
Barras horizontais com preenchimento gradiente e percentuais.
Metricas de Performance
Leads qualificados 75%
Taxa de conversao 50%
Satisfacao do cliente 98%
Meta mensal 25%
chart / progress / gradient fill
05
Stats / KPIs
Numeros grandes com tendencia, label e mini sparkline.
Receita
+12%
R$ 84k
Clientes
+8%
152
Conversao
-3%
4.2%
NPS
+5
78
chart / kpi / sparkline + trend arrow