iOS Clocks

Show Preview
iOS Clocks

About iOS Clocks

What is Clocks iOS?

Clocks iOS is a premium real-time clock component that recreates the native iOS clock widget inside Framer. It features one main analog clock with city name and GMT offset, plus three smaller clocks with customizable timezone labels. Every hand animates in real-time with smooth second-hand movement. Ideal for personal sites, travel pages, dashboards, and agency portfolios that need a polished, functional time display.

Core Features

  • Real-time animated clock hands with smooth second-hand sweep

  • Four independent timezone clocks with 30+ city presets including New York, London, Tokyo, Sydney, and more

  • Five curated themes: iOS Light, iOS Dark, Midnight, Sunset, and Minimal

  • Fully responsive layout that scales to any container size

  • iOS-accurate donut-style center dot, rounded or square hand styles, and toggleable hour numbers and minute ticks

Controls inside Framer

Theme

  • Theme preset selector (iOS Light, iOS Dark, Midnight, Sunset, Minimal)

Main Clock

  • City timezone selector

Clock 2 / Clock 3 / Clock 4

  • City timezone selector

  • Custom short label

  • Visibility toggle

Colors

  • Card background

  • Clock face background

  • Pill background

  • Hour hand, minute hand, and second hand colors

  • Number, tick, and minute tick colors

  • City label, GMT text, and city name colors

  • Center dot and clock border colors

Font

  • Font family and weight control

Clock Style

  • Second hand visibility toggle

  • Hour numbers toggle (12, 3, 6, 9)

  • Minute ticks toggle

  • Hand style (Rounded or Square)

Best use cases

  • Personal portfolio sites showcasing international availability across timezones

  • SaaS dashboards with live world clocks

  • Travel and lifestyle websites displaying destination times

  • iOS and mobile app showcase pages needing authentic native UI elements

Ship a pixel-perfect world clock in seconds — no custom code, no design compromises.

Questions or custom requests?

We design and build custom Framer components. Get in touch atcontact@teampixel.com.au.