---
title: "Chrona Digital Clock — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Deiondrick Roberts · Interactive. Key Features Dual Mode: Digital or World Clock with up to 4 cities Timezone Aware: Auto-detect or manual IANA selection Global…"
canonical: "https://framer.elliotli.dev/component/chrona-digital-clock"
---

[Home](/)/[Components](/components)/[Interactive](/components/category/interactive)/Chrona Digital Clock

# Chrona Digital Clock

[View on Framer](https://framer.com/marketplace/components/chrona-digital-clock/?via=elliot-li)

![Chrona Digital Clock preview image 1](https://framer.elliotli.dev/og/component/chrona-digital-clock/c3cb137281d755d5/1600x1200.jpg)

## Summary

Key Features Dual Mode: Digital or World Clock with up to 4 cities Timezone Aware: Auto-detect or manual IANA selection Global Date Formats: 11 international standards Glass &…

## Description

**Key Features**

-   **Dual Mode:** Digital or World Clock with up to 4 cities
    
-   **Timezone Aware:** Auto-detect or manual IANA selection
    
-   **Global Date Formats:** 11 international standards
    
-   **Glass & Glow Effects:** Minimal or retro neon styles
    
-   **Dynamic Scaling:** Smart typography fit in any card
    
-   **Interactive Toggle:** Tap to switch 12h / 24h
    
-   **Accessibility Built-In:** Screen reader and ARIA support
    
-   **Presets:** Instantly apply US, EMEA, or APAC city groups
    
-   **Framer-Native:** Built using Workshop — no dependencies
    

## 🧭 How It Works

-   **World Clock Toggle:** Instantly switch between single-zone and multi-city world time.
    
-   **Format Selector:** Choose 12-hour or 24-hour display with one tap.
    
-   **Tap Toggle:** Enable or disable format switching on click.
    
-   **Seconds Display:** Show or hide seconds for a minimal or precise look.
    
-   **Blinking Colon:** Add subtle animation for a classic digital clock feel.
    
-   **Date Visibility:** Show or hide the current date below the time.
    
-   **Date Format Dropdown:** Pick from multiple global formats (US, EU, ISO, Japan/Korea, etc.).
    
-   **Timezone Selector:** Choose a specific region or let it auto-detect your current zone.
    
-   **Style Preset:** Toggle between “Mono Minimal” and “Retro Dot-Matrix” display styles.
    
-   **Text & Accent Colors:** Customize typography and accent hues for perfect contrast.
    
-   **Accent Underline:** Add or hide a highlight line beneath the time.
    
-   **Glass Panel:** Enable a frosted glass look with adjustable blur intensity.
    
-   **Alignment Control:** Left, center, or right align the clock inside its container.
    
-   **Size Presets:** Choose Compact, Medium, or Large to fit any bento layout.
    
-   **Font Controls:** Set separate fonts for time and date to match your site’s typography.
    
-   **Padding & Radius:** Fine-tune spacing and corner rounding for clean visual balance.
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #10829

## Details

- **Author**: Deiondrick Roberts
- **Price**: $10.00
- **Published**: 2025-10-23
- **Updated**: 2025-10-24
- **Added**: 2025-10-12
- **Categories**: Interactive

## More like this

-   [Drawing component](/component/drawing-component) — Ariel Barrios · Free — Just a free drawing component
-   [Code Comparison](/component/code-comparison) — Syauqizaidan Khairan Khalaf · $5 — Before and after code side by side
-   [Voice Testimonials](/component/voice-testimonials) — valorsic studio · $15 — Voiceover & typewriter reviews
-   [Product Tour Pro](/component/product-tour-pro) — Oddframe · $10 — Showcase Products Step by Step