Data display
Tables, stats, avatars
Components

Data display

Tables that animate their rows on sort, numbers that count, and cards that lift on hover.

Data table

New

Typed columns, natural sorting with FLIP-animated rows, selection with an indeterminate header, cell slots, and a skeleton loading state.

AL
Ada Lovelaceada@analytical.io
 ActiveEnterprise48€4,200
MH
Margaret Hamiltonmargaret@apollo.space
 ActiveEnterprise36€3,100
BL
Barbara Liskovbarbara@mit.edu
 ActivePro15€735
AT
Alan Turingalan@bletchley.dev
 ActivePro10€490
GH
Grace Hoppergrace@cobol.org
 Past duePro5€245
LT
Linus Torvaldslinus@kernel.org
 TrialStarter2€0
DR
Dennis Ritchiedmr@bell-labs.com
 ChurnedPro0€0
KT
Ken Thompsonken@plan9.dev
 TrialStarter3€0
2 of 8 row(s) selected

Stats & numbers

Updated

Stat cards and the compact StatStrip. Numeric values count up on mount and tween to new values. Trend badges and descriptions are optional.

Revenue
€48,290 +12.4%vs last month
Customers
1,284 +4.1%
Conversion
3.8% -0.6%
Churn
1.2%
Static string values render as-is.
  • 1,284customers
  • 313invoices
  • €48,290revenue
Total processed€1,158,960

Cards

Updated

Interactive cards lift gently with a soft shadow. Tone variants and InfoCard are available for status surfaces.

Deployments

Ship previews for every branch.

Access control

Roles, SSO and audit logs.

Billing

Usage-based invoices in any currency.

All systems operational · 99.99% uptime
Scheduled maintenance on Sunday at 02:00 UTC
What's new

A motion system, 20 new components, and a brand-new demo.

Latest

Avatar

New

Images fade in when loaded, initials are generated from names, and status dots pulse.

ALOnlineATBusyGHAwayLTOfflineMHOnlineVU
ALATGHLT +3
7 teammates are working on this project

Badges & chips

Updated

Badges gain status dots and a live pulse. Removable chips animate out.

Neutral Operational Degraded Outage Beta
design-system
motion
accessibility
nuxt
breaking

Progress & skeleton

Updated

Progress fills with a smooth expo ease, and an indeterminate mode is built in. Skeletons shimmer instead of blinking.

Uploading assets35 / 100
design-tokens.zip35%
Indeterminate

Data list

Compact key-value rows for detail panels.

CustomerAda Lovelace
Plan Enterprise
Monthly revenue€4,200
RenewalMarch 14, 2027