MSDR Design System

Exibição de dados

Card, Table, Item, Avatar, Progress, Accordion e os componentes MSDR de métrica. Nenhum card recebe sombra por padrão.

Card

Padrão
Receita recorrente
Últimos 30 dias
Separação por superfície e anel de 1px — sem sombra.
size=sm
Compacto
Padding reduzido para grades densas de KPI.

Métricas (MSDR)

MetricTrend aceita invert: em churn, cair é bom — o tom não assume que positivo é sempre verde.

R$ 148.320Receita recorrente
1.284Clientes ativos
+12,4%-3,2%-0,6%0%
Receita recorrente
R$ 148.320
+12,4%vs. período anterior
Churn mensal
1,8%
-0,6%vs. período anterior
Carregando

Table

ClientePlanoMRR
Aurora LabsGrowthR$ 187,00
Dunas TechScaleR$ 303,00
Fluxo SistemasStarterR$ 81,00

Item

Documentos

12 arquivos · 4,2 MB

Contrato 2026

PDF · 320 KB

Avatar, Progress e Skeleton

Avatar
EMAL
ABC
+4
Progress
x
x
Skeleton

Accordion e Collapsible

Timeline (MSDR), ScrollArea e AspectRatio

  1. Contrato assinado

    Plano Growth, 25 licenças

    12 mar 2026
  2. Primeiro acesso13 mar 2026
  3. Upgrade para Scale02 ago 2026
AspectRatio 16:9

Nem todo agrupamento precisa de Card. Quando o conteúdo já está dentro de um card, prefira separar por título e espaçamento — card dentro de card adiciona uma borda sem adicionar significado.