Tiny Clock
A fully customizable analog clock for Framer. Set any timezone, adjust colors, hand style, and create elegant time displays for your projects.
Made with Workshop
Build your own component with AI
A fully customizable analog clock for Framer. Set any timezone, adjust colors, hand style, and create elegant time displays for your projects.
Made with Workshop
Build your own component with AI
A versatile analog clock component for Framer, designed to display any city’s time with style.Perfect for global agencies, SaaS dashboards, portfolios, or landing pages, it lets you create elegant and interactive time zones with full control over design.
Customize the clock face, colors, radius, and the size and roundness of the hour, minute, and second hands. Simply choose a timezone and the clock updates automatically.
Insert the component into your project.
Select the desired timezone from the property panel.
Adjust colors (background, border, hands) to match your brand.
Control the size, length, and roundness of each hand.
Preview live inside Framer to perfect your design.
Timezone: Choose any IANA timezone (e.g. Europe/Paris, America/New_York).
Face & Border Colors: Match your brand palette.
Hand Colors: Customize hour, minute, and second hands individually.
Hand Width & Length: Control proportions.
Hand Roundness: Switch between sharp or rounded edges.
Border Thickness: Adjust outer ring style.
Real-time analog clock with timezone support.
Fully customizable design (colors, sizes, styles).
Smooth hand movement with second option.
Easy to integrate in any Framer project.
Perfect for multi-office agencies, SaaS, or portfolios.
Responsive and lightweight for modern websites.
Agencies showing multiple office time zones.
SaaS dashboards needing real-time clocks.
Portfolios with stylish, animated time displays.
Landing pages or hero sections with global presence.
Contact pages showing your working hours.
Made with love by Le Lab Framer.
