The Clock of Clocks component transforms time into motion. This Framer component displays the current time using an array of miniature clocks, each one moving in harmony to form digits through the direction of their hands.
Every second, the smaller clocks elegantly rotate to update the time, creating a dynamic, living sculpture inside your Framer project. It’s a stunning blend of technology, design, and precision. Perfect for portfolios, landing pages, or creative displays.
Easily customize the layout, clock size, spacing, colors, and animation speed to match your aesthetic.
Each clock and animation can be customized from the Framer sidebar:
Clock Size → Adjust the size of each clock circle
Gap → Set spacing between each clock
Border Color → Customize the stroke color of each clock
Background Gradient
BG Start → First color of the gradient fill
BG End → Second color of the gradient fill
Hand Color → Color of both rotating clock hands
Shadow Toggle → Enable or disable the soft 3D shadow
Animation Speed → Control how quickly the hands rotate between updates