Beautiful animated clock with smoothly sliding digits and gradient border
Preview
0
0
:
0
0
:
0
0
Installation
Usage
import { AnimatedTimer } from "@/components/ui/animated-timer"
export default function Page() {
return <AnimatedTimer />
}Examples
Without seconds
0
0
:
0
0
<AnimatedTimer showSeconds={false} />12-hour format
0
0
:
0
0
:
0
0
<AnimatedTimer use24Hour={false} />Props
| Prop | Type | Default | Description |
|---|---|---|---|
| showSeconds | boolean | true | Show seconds |
| use24Hour | boolean | true | 24-hour format |
| className | string | - | Additional classes |