Project: Create A Clock That Displayed Time As Hex Color

Title: Create A Clock That Displayed Time As Hex Color

About This Project:

This project will help you learn how to create a clock that represents the time as hex color values. Jamel Hammoud saw a project a little while ago, where he discovered that the time (in format 00:00:00) works perfectly for hexadecimal codes. He decided to create a very small project using vanilla JS, to represent the live time as a color.

This small codeblock gets the current time, formats it (placing a zero before the number if it is less than ten) and then appends an # before it. That newly created hex code is then placed within the #clock element, and is set as the backgroundColor of the body. Changing the color of the background with the hex color gives the site an almost meditative feel.

Code And Demo: Create A Clock That Displayed Time As Hex Color

Related Projects:

Help Someone By Sharing This Article