Making a hexadecimal color clock using vanilla JavaScript

@ thecodeplayer

View code Play Walkthrough

Description

The inspiration for this walkthrough came from a beautiful and elegant hexclock made by @jacopocolo which shows the current time as a 6 digit hexadecimal number which is simultaneously used as the background color. As time progresses it also changes the background color bit by bit.

The color ranges from #000000 to #235959 which means it will always be dark.

The idea is so simple and involves so little code that I decided to make a quick walkthrough on it as it would be a great tutorial for beginners who want to start with JavaScript.

Add New Comment

8 Comments

(close)

Tigran

You are the GENIUS!!!
Good!!!

Joshu

Awesome
Creative

thepolm3

So simple, yet so clever!

ysfu

Great job, very clever!

ps: add 1s transition body for a smoother change

me

wow! This is something special.. great job

Sven

Hey man, nice work. I have been in love with colorclock for a long time and i never had the idea to replicate it, which is a shame :)
Thanks so much for the work and the idea.
For your information i am working on top of what you’ve built my own version, would you be interested in share our code on Github and work with me this?

Serdar

minimal, expressive, brilliant idea
its very simple but stunning work.
you should make a mobile app or something for that. like a screensaver clock may be. i would surely use it.