Tint and Shade Samples
Create five color samples by mixing your base color with white and black.
How to use
- Choose a base color and the maximum proportion of white or black to mix at either end.
- Read the samples from two darker colors through the base to two lighter colors, then copy the codes.
- Before using a sample for text or borders, check its contrast against the actual background.
When to use this tool
Create lighter background colors and darker border colors from one base color. Unlike hue harmony palettes, this tool compares five mixtures made by adding white or black.
Inputs and settings
Result
Example input and actual output
- Base color: #808080
- Maximum mix (%): 100
#000000 #404040 #808080 #c0c0c0 #ffffff
In the example the endpoints are black and white, with the original gray in the middle. The inner samples use half the maximum mix. Mixing encoded sRGB values does not produce perceptually equal lightness steps.
Scope and limitations
Mixes encoded sRGB components linearly. This does not simulate physical light or paint.
Next step and alternatives
Base Color Palette — Explore different hues when you need more than lightness variations.
Frequently asked questions
What happens at 0% mix?
No white or black is mixed in, so all five samples equal the base color.
Is this the same as mixing paint or light?
No. These are numerical mixtures of encoded sRGB channels, not a physical simulation or a CMYK conversion.
What mix is used for the two inner samples?
They use half the maximum mix. The center retains the base color; the endpoints mix white or black at the specified maximum.
Related tools
Share this tool
Share only the tool name and public URL. Your input and results are not included.