Classic Analog Clock

Show Preview
Classic Analog Clock

About Classic Analog Clock

A clean analog world clock component with local and custom GMT support, auto day and night theming, and refined typography controls. Built for dashboards, hero sections, travel sites, and global products that need a live time display with a polished minimal look.

Classic Analog Clock is a fully customizable analog clock component designed for elegant, functional time display inside Framer. It supports both the visitor’s local time and custom GMT offsets, updates automatically in real time, and includes a date window that stays synced with the selected timezone.

The component is designed to remain visually stable, scale smoothly inside any frame, and be easy to configure through built-in controls.

What the User Can Control

1. Time & Timezone

  • Local visitor time

  • Custom GMT input like GMT+7, GMT-6, or GMT+5:30

  • Synced date display based on the selected timezone

2. Clock Movement

  • Show or hide the second hand

  • Choose between Quartz, Digital, and Mechanical second-hand motion

  • Real-time analog hand movement

3. Theme & Appearance

  • Automatic day and night theme switching

  • Single-color OKLCH theme generation

  • Separate manual styling for day and night states

  • Custom face, hands, numerals, label, and date window colors

4. Typography & Branding

  • Full font controls for label, numerals, and date

  • Switch between text label and uploaded image

  • Adjustable image size for logo-based branding

What This Component Is Good For

  • Dashboards and utility interfaces

  • Hero sections and landing pages

  • Travel, booking, and global products

  • Portfolio websites and editorial layouts

  • Timezone-based or location-aware designs

Why It Stands Out

  • Minimal analog clock design

  • Local and custom GMT support

  • Quartz, Digital, and Mechanical movement styles

  • Auto day and night styling

  • OKLCH-based theme workflow

  • Flexible typography and branding controls

  • Clean scaling inside responsive layouts