Metrik-Karte

Dashboard-Kennzahl (Untitled-UI-Muster): Label, großer Wert, Delta-Badge mit Richtung (steigend grün / fallend rot), Vergleichstext

Im Builder nutzen

Nutzt: ui.icon

Beispiele

Steigend

Umsatz (30 Tage)48.560 €↑ 12 %vs. Vormonat

Fallend

Retourenquote4,2 %↓ 0,8 %vs. Vormonat

Ohne Delta

Offene Aufträge12

Eigenschaften

Prop	Typ	Default	Builder-Label
label *	string	—	Label
value *	string	—	Wert (formatiert)
delta	string	""	Delta (z.B. 12 %)
direction	string: up | down | neutral	"up"	Richtung
comparison	string	""	Vergleichstext (vs. Vormonat)

* Pflicht-Prop

Genutzte Design-Tokens

border.hairlinecolor.border.defaultcolor.status.dangercolor.status.danger-surfacecolor.status.successcolor.status.success-surfacecolor.surface.defaultcolor.surface.sunkencolor.text.defaultcolor.text.mutedelevation.controlfont.family.defaultfont.family.displayleading.tightradius.fullradius.surfacesize.05size.2size.5text.3xltext.smweight.mediumweight.semibold