Background Changer

Page section: playground

Changes the background to an hsl a random colour where the luminance value is not greater than 65%.

As the JS seems to convert the HSL colour into RGB by the time it’s in the <body> tag, the HSL value is added below.

background:

The lightness of a colour is determined not just by it’s luminance value but also it’s hue and saturation values. Some hues, such as yellow or cyan, are lighter that others. The less saturated a colour is the lighter it will appear. So trying to keep colours dark using hsl values is actually not that straightforward.

Full script for this page