LoginGet started — it’s free
Made in Webflow

Local Timezones [Utility]

Clone in Webflow46
Dhruv Sachdev's avatar
by Dhruv Sachdev
400
site profile thumbnail

Description

An automatic timezone clock for cities around the world 🌍 Show the current local time for your city. It keeps itself up to date every 60 seconds. I've used CSS to add a blinking effect. How it works: It uses data attributes to define the timezone. I've written code to calculate and display the local time of your city. There are separate colours for "Open", "Evening", and "Closed" office hours. These can be styled through their respective classes. How to use: 1) Find your timezone: https://timezonedb.com/time-zones 2) The "Location Row" element contains a single data-timezone attribute. Change the value to your timezone. Everything else will auto-update :) You can change the opening/ closing hours & messages in custom code. The design was inspired by https://practice.inc

Feeling inspired?

If this Made In Webflow site sparked some inspo, why not get started on a project of your own? Clone a site, purchase a template or start building from scratch.
timezonelocalisationtimeclockblinkinglocaltimetimezonescitycitiesanimation

More by Dhruv Sachdev

See profile
View details
20 Line Hover Animations
354
627
© 2022 Webflow, Inc. All rights reserved.