https://github.com/noccer/hexidecimal-time-swatch

A single page app that prints out every second of the current hour as a hexidecimal colour.
https://github.com/noccer/hexidecimal-time-swatch

color hexidecimal javascript single-page-app

Last synced: about 1 year ago
JSON representation

A single page app that prints out every second of the current hour as a hexidecimal colour.

• Host: GitHub
• URL: https://github.com/noccer/hexidecimal-time-swatch
• Owner: noccer
• Created: 2018-01-16T11:58:40.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2018-01-16T12:41:40.000Z (over 8 years ago)
• Last Synced: 2025-02-07T09:41:47.877Z (over 1 year ago)
• Topics: color, hexidecimal, javascript, single-page-app
• Language: JavaScript
• Homepage: https://noccer.github.io/hexidecimal-time-swatch/
• Size: 172 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Hexidecimal Time Swatch

[View a live demo here](https://noccer.github.io/hexidecimal-time-swatch/)

A simple single page app that prints out every second of a given hour as a colour swatch. Hover over each cell to see what time of the day the colour represented.

## What is it?

In html pages, you can choose to colour an element using the [hexidecimal colour system](https://en.wikipedia.org/wiki/Hexadecimal).

> Example 1: `#000000` represents black

> 


>   I am a div with background colour #000000;

>


> Example 2: `#ff0000` represents red

> 


>   I am a div with background colour #ff0000;

>


That means that any time of the 24-hour day from `00:00:00` to `23:59:59` can be represented as a colour:

> Example 3: `#113949` represents 11:39:49am

> 


>   I am a div with background colour #113949, which was derived from `11:39:49am`;

>


## Eh, but what does this repo do?

Well it takes the current hour, performas a loop over all 3600 seconds and renders a colour cell for each of those seconds. Neat!



    



## Todo

- rebuild in React maybe

- add a counter interval to update the highlighted cell every time a second ticks.