Components
Oversized Live Figures
A type-led proof-by-numbers band of oversized animated numerals that count up on scroll-into-view via NumberFlow, anchored by a single cyan signal figure.
Oversized proof-by-numbers band: each metric is a huge numeral that counts up on view via NumberFlow, with one cyan signal figure and the rest in warm-white. An IntersectionObserver triggers the count-up, with a mount/timeout fallback so below-the-fold and screenshot renders still reach the final values.
npx shadcn@latest add @vandoko/vkb-stat-02Usage
import { VkbStat02 } from "@/components/vkb-stat-02";
export default function Example() {
return (
<VkbStat02
eyebrow="The proof is in the numbers"
heading="Outcomes you can count."
stats={[
{ value: 94, suffix: "%", label: "Of sprints ship on the first deadline" },
{ value: 5, suffix: "wk", label: "Median time from kickoff to live", accent: true },
{ value: 210, suffix: "+", label: "Products designed and engineered" },
{ value: 38, suffix: "%", label: "Average lift in activation we measure" },
]}
/>
);
}Each StatItem accepts value, optional prefix/suffix, a label, and an accent flag — set accent: true on exactly one figure to make it the lone cyan signal.