Colour Brightness Adjustments

This page has now been moved to Experiments with Colour and Brightnesses.

Colour Brightness Experiment

Colour Brightness Adjustments.

Adjust the brightness of a given colour. With the sliders on the left you set the brightness level and the base colour.						The sliders on the right show the adjusted RGB values. Do not move these, they are for information only.
↑↓	255	255	255		Base Colour	Adjusted		255	255	255
					Base:    Adjusted:

Colour Brightness Values

	STW*	W3C YIQ	CIE XYZ	Lightness	Average
Base
Adjusted

Page uses cookies to remember settings from one session to the next unless disallowed. Allow cookies?

★ Meaning and Purpose of this Page ★

There are two colour panels, one left, one right, titled Base Colour and Adjusted.

To the left of the colour panels there are four sliders.

The leftmost slider adjusts the BRIGHTNESS of the base colour that is in the left panel and shows the result in the right panel.

The three RGB sliders that are to the left of the colour panels adjust the colour (hue) in the leftmost panel, when you move them they simultaneously set the rightmost colour panel to match the leftmost, which they have to do, if you think about it.

The three sliders to the right of the colour panels are not for sliding by hand, they show the brightness RGB values of the rightmost colour panel. They are there as sliders solely to show the RGB values in a graphic format that is relative to the sliders on the left.

Underneath the colour panels, where it says ‘Colour Brightness Value’ there are five columns, each one showing the brightness value of both the base colour (the leftmost colour panel) and the adjusted colour (the rightmost colour panel).

Each of the Colour Brightness Values is expressed according to a different formula.

STW* is the formula devised by me, and discussed in detail on Readable Text in Colour – STW*.

W3C YIQ is the YIQ formula recommended by the W3C and discussed on Holes in the W3C Colour Readability Guidelines.

The formulas for other three: CIE XYZ, Lightness and Average, can be found on Puzzling Greys.

You can use this page when you want to get a higher or lower brightness for a colour, for it is not always easy to do that by eye when there’s more than one of the RGB triad at greater than zero.