Page title

The colors in this page are, from darkest to lightest:

x 1 = hsl( 260, 20%, 18% )
x 2 = hsl( 260, 20%, 36% )
x 3 = hsl( 260, 20%, 54% )
x 4 = hsl( 260, 20%, 72% )
x 5 = hsl( 260, 20%, 90% )

These are all multiples of the same combinations.

There is no black or white, which can be jarring--only different combinations of foreground and background to create visual coherence.

Highlight colors, such as hyperlinks, can be a color from an opposite (or split-opposite) part of the spectrum.

To keep the number of variations down, the color of the "Subtitle" text above is the same as the background color of the containing div.

The colors in this page are, from darkest to lightest:

x 1 = hsl( 180, 20%, 18% )
x 2 = hsl( 180, 20%, 36% )
x 3 = hsl( 180, 20%, 54% )
x 4 = hsl( 180, 20%, 72% )
x 5 = hsl( 180, 20%, 90% )

These are all multiples of the same combinations.

There is no black or white, which can be jarring--only different combinations of foreground and background to create visual coherence.

Highlight colors, such as hyperlinks, can be a color from an opposite (or split-opposite) part of the spectrum.

To keep the number of variations down, the color of the "Subtitle" text above is the same as the background color of the containing div.

The colors in this page are, from darkest to lightest:

x 1 = hsl( 60, 20%, 18% )
x 2 = hsl( 60, 20%, 36% )
x 3 = hsl( 60, 20%, 54% )
x 4 = hsl( 60, 20%, 72% )
x 5 = hsl( 60, 20%, 90% )

These are all multiples of the same combinations.

There is no black or white, which can be jarring--only different combinations of foreground and background to create visual coherence.

Highlight colors, such as hyperlinks, can be a color from an opposite (or split-opposite) part of the spectrum.

To keep the number of variations down, the color of the "Subtitle" text above is the same as the background color of the containing div.

Limited Color Palettes Made Easy