An animated number that springs toward its target value with natural easing and overshoot.
Monthly revenue
$1,240
pnpm dlx shadcn@latest add https://matos-ui.com/r/physics-counter.jsonimport { PhysicsCounter } from '@/components/matos-ui/physics-counter'<PhysicsCounter value={1240} prefix="$" />| Prop | Type | Default | Description |
|---|---|---|---|
value | number | - | Target value the counter springs toward. |
decimals | number | 0 | Number of decimal places to display. |
prefix | string | - | Text rendered before the number (e.g. "$"). |
suffix | string | - | Text rendered after the number (e.g. "%"). |
size | "sm" | "md" | "lg" | "md" | Font size preset. |
stiffness | number | 90 | Spring stiffness for the count animation. |
damping | number | 18 | Spring damping for the count animation. |
Install Matos UI
Choose a package manager and copy one command for every component.