The purpose of this tool is to accurately produce tints (pure white added) and shades (pure black added) and tints (pure gray added).
Shades, tints and tones can be very useful in logo design, web design, typography, and are often paired with a complementary color for contrast.
Adding black in varying levels to a color produces gradually darker variants, or 'shades', of that particular color.
Just as with tints, you can add black to any of the hues of the color wheel or to any combination of hues of the color wheel to create shades of that hue by adding various amounts of black. Shades can range from a barely shaded pure hue to a deep black color that is in the color family of the original hue.
You can also create your own chromatic blacks, avoiding the use of black from a tube altogether. A chromatic black, or black made by mixing other colors together, can generally be made by mixing together the darkest hues of complementary colors. This will produce a rich deep dark color that is very close to black. There are also other combinations that will give you a nice dark color and it is worth experimenting to find what works for you. .
Color tints are made by adding white to a color, resulting in increasingly lighter versions. An example of a tint is pink. Pink is a tint created by adding white to red. It is also sometimes called a pastel color. Tints can range from nearly the full saturation of the hue to practically white. Sometimes you can add a small bit of white to a color to increase its opacity and covering strength.
Tinting a color also desaturates the hue, making it less intense. Red when tinted becomes pink. Blue when tinted becomes "baby blue." Tints are often thought of as calmer and quieter colors and are often used for newborn apparel and accessories.
Tones are created by adding gray to a color, and produces an almost endless variety of colors depending on what level of gray is used. A tone is created when you add both white and black (which is gray), to a color and tone it down, or desaturate it.
You might see elsewhere the words tone and value used interchangeably, expressing the range of lights and darks in a design, as in "tonal range" or "tonal value" but for the purposes of understanding tints, tones, and shades in design we will stick to the definition of tone as adding gray to a color.
Most colors that we see in our daily environment have been toned down, or grayed down, to some extent. They are desaturated colors. It would be jarring and overpowering to our visual senses to be bombarded by colors at full saturation all the time. Tones bring complexity and subtlety to color and make pure, saturated color that much more of a visual statement when it is used.
Because tones are more subtle they are also easier to combine with other colors in pleasing ways. Tones can either be lighter or darker than the original hue, depending on the proportions of black, white, and the original hue used.