Three horizontally divided metric cells in one card, each with a label, value, and semantic delta arrow.
New here? Read the installation guide.
import { Dashboard29 } from "@/components/beste/piece/dashboard29";
<Dashboard29
metrics={[
{
"label": "ARR",
"value": "$1.82M",
"delta": 8.4
},
{
"label": "Churn",
"value": "2.1%",
"delta": -0.3
},
{
"label": "NPS",
"value": "48",
"delta": 6
}
]}
/>This week
Mon – SunBooked
142
+9
No-shows
3
-4
Hours
96
0
A wide panel with a titled header row and three metrics split by vertical hairlines, each carrying its own signed change.
Side-by-side compare card with previous and current values separated by an arrow, and a semantic delta pill in the header.
Top-three ranking card with gold, silver, and bronze medal circles next to names and monospaced scores.
Compact metric card with a large value, delta percentage, and an SVG sparkline with a tone-colored stroke and faint area fill.