The shade generator makes it easy to create shades and tints that are perceptually uniform and accessible.
First, select the number of shades you need using the + and - icons under the Number of shades
title.
After that, select the lightness range. Use the Start
and End
sliders for that.
By default, the generator creates shades evenly distributed in the lightness range. This creates shades with odd lightness values (40.14, 60.23, etc.). To avoid this turn on the Nice lightness values
toggle. Now the generated shades will have lightness values aligned to fractions of 2.5 (20, 27.5, 35, etc.)
When you are happy click on the Generate
button.
Every time you generate the whole palette is regenerated (except for the source colors). To avoid overwriting some colors you can exclude them from the generator by unchecking the Include in generator option
. When some colors are excluded you can't adjust the number of shades.
After generating you can further customize each color to make it just right. Start by clicking on the Hue shifting
button.
When shades are generated they all have the same hue value. By slightly changing the hue value you can achieve even better outcomes - this is called Hue shifting. In Atmos, you can do this by using the hue shifting chart.
The chart visualizes the shades from darkest to lightest on a bezier curve.
3 points make up the curve:
To adjust the curve either move one of the points or handles.
Last updated March 2022