speedContent
MetricCard
A metric card: label, large value, wavy progress bar and a slowly rotating shape.
Live preview
Reference specimen. Example copy comes from the Pelote specs and is in French.
ExpressiveRéférence
CPU42 %4 cœurs · load 1.68 Disque88 %Presque plein · 70 / 80 GB La forme tourne en 40 s, opacité 0.55. Désactivé si mouvement réduit.
UX / UIRègles illustrées
check_circleÀ faire
Grande valeur, contexte en dessous.cancelÀ éviter
3172.4482 MBram_used_bytes
Variante M3EMême composant, mêmes rôles, autre matière
PlazaWii U / 3DS
Tuile de menu, barre rayée en creux.
ChromeY2K
Afficheur à segments, chiffres Michroma.
infoReference specimen. Example copy comes from the Pelote specs and is in French.
A metric card: label, large 48px value, wavy M3 Expressive progress bar, context, and an expressive shape slowly rotating in the top right corner.
Rules
- A different shape per card in the same row, container tints only.
- The wave turns warn above the threshold (85%), with the word in the sub line.
- Tabular figures. role="meter" and ARIA values on the track.
- Compact (widget bar): 34px value, 24px radius.