Count Up Demo

1import { CountUp } from "@/registry/loomui/count-up"
2 
3export default function CountUpDemo() {
4  return (
5    <div className="grid w-full max-w-md grid-cols-3 gap-6 text-center">
6      <div>
7        <CountUp
8          value={48291}
9          className="text-3xl font-semibold tracking-tight"
10        />
11        <p className="text-muted-foreground mt-1 text-xs">Installs</p>
12      </div>
13      <div>
14        <CountUp
15          value={99.9}
16          decimals={1}
17          suffix="%"
18          className="text-3xl font-semibold tracking-tight"
19        />
20        <p className="text-muted-foreground mt-1 text-xs">Uptime</p>
21      </div>
22      <div>
23        <CountUp
24          value={12}
25          prefix="$"
26          suffix="M"
27          className="text-3xl font-semibold tracking-tight"
28        />
29        <p className="text-muted-foreground mt-1 text-xs">Processed</p>
30      </div>
31    </div>
32  )
33}