Horizontal milestone tracker with tone-filled done checks, a ringed current step, muted pending steps, and dates below.
New here? Read the installation guide.
import { Dashboard26 } from "@/components/beste/piece/dashboard26";
<Dashboard26
heading="Milestones"
steps={[
{
"label": "Design",
"date": "Apr 2"
},
{
"label": "Build",
"date": "Apr 12"
},
{
"label": "QA",
"date": "Apr 22"
},
{
"label": "Launch",
"date": "May 3"
}
]}
current={2}
tone="violet"
/>Radial progress gauge with a tone-colored arc, the percentage centered, and a caption line beside it.
Status-page timeline where every day is a thin vertical tile colored by up, degraded, outage, or no-data state.
Actual-vs-target bar with a tone-colored actual fill on a muted track and a thin foreground tick marking the target.
Target-tracking card with a target icon, current / goal values, a tone-colored progress bar, and a deadline footer.