Dull Color Generator

What this tool does

Not every design wants loud colours. Plenty of them call for quiet, muted tones, the understated colours that feel calm, grown-up, and unshowy. Finding these among fully random colours means wading past all the bright ones, and toning a colour down by hand in a picker is slow and easy to overdo.

That is what this does. Tap the button and it gives you a dull colour, a muted, subdued tone, with its codes ready to copy, and tap again for another. Every result is a soft, low-key colour rather than a vivid one, so you get a steady supply of the restrained tones a calm or sophisticated design is built on.

How to use it

1. Generate a colour. Tap generate for a muted colour, and keep tapping for more.
2. Read its codes. The tool shows the dull colour as a swatch with its values in the usual formats.
3. Copy what you need. Take the colour in whichever format suits your work, or generate another.

Tap for a muted colour, keep going to see the subdued options, and copy any that fit the low-key feel you want.

How it works

What makes a colour dull is having little saturation, so the tool builds its colours by keeping the saturation low. It chooses a hue and a brightness but holds the intensity down, which leaves a colour that reads clearly as a hue while staying soft and greyed rather than vivid. The result is shown and written out in the usual formats using TinyColor.

Keeping the saturation modest is the whole trick. A dull colour still has a definite hue, a muted blue is unmistakably blue, but that hue is quiet rather than shouting, because the colour sits well back from its most intense version. By fixing that low intensity and varying the rest, the tool produces colours that are consistently subdued while still ranging across the spectrum.

What makes a colour dull

A dull colour is one with low saturation, meaning it has had much of its intensity drained away. Saturation measures how far a colour is from grey, from a flat neutral up to a pure, vivid hue, and a dull colour sits near the grey end of that scale. It has enough colour to show its hue, but not enough to feel bright.

You can think of a dull colour as a vivid one with grey mixed in. That grey is what softens it, turning a punchy blue into a muted slate, or a bold green into a soft sage. The hue is still there and still recognisable, but it is subdued, which gives dull colours their calm, weathered, understated quality. They are colours that whisper rather than shout.

Dull, pastel, and grey are different

It is easy to lump muted colours together, but dull, pastel, and grey are three distinct things worth telling apart. A dull colour has low saturation at an ordinary brightness, so it is a proper colour that happens to be muted, like a soft olive or a dusty blue. It is quiet because it lacks intensity, not because it is especially light.

A pastel, by contrast, is defined by being light: it is pale, high on the brightness scale, with a gentle rather than absent saturation. And a grey has no saturation at all, no hue to speak of, only a level between white and black. So a dusty blue is dull, a baby blue is pastel, and a plain silver is grey. This generator produces the first kind, muted colours that keep their hue, which is different from the pale softness of pastels or the hueless neutrality of greys.

Why generate dull colours

Muted colours are what you reach for when a design should feel refined, calm, or serious. They suit editorial layouts, upmarket brands, natural and earthy themes, and any setting where loud colour would feel out of place. When restraint is the goal, a source of ready muted tones saves you toning everything down yourself.

They are also easy to live with over time. Bright colours can tire the eye, while muted ones sit comfortably in the background and let content take the lead, which is why so many mature, professional designs lean on them. Reaching for dull colours is a way to give a design a considered, understated feel rather than a flashy one, and generating them directly is quicker than muting bright colours one by one.

Building a muted palette

Muted colours combine especially well, which makes them a natural basis for a palette. Because none of them is fighting for attention, several dull tones can sit side by side in harmony, giving a scheme that feels cohesive and calm. Generating a few and keeping the ones that work together is an easy way to assemble such a set.

The one thing to watch is that an all-muted palette can start to feel flat or gloomy if nothing lifts it. A common remedy is to let one slightly stronger colour act as a gentle accent, or to lean on clear differences in lightness between the tones so the design still has structure. With that bit of contrast in place, a muted palette reads as sophisticated and intentional rather than washed out, which is exactly the effect these colours are good for.

Questions people ask

How do I generate a dull colour?

Tap generate and the tool gives you a muted colour with its codes. Tap again for another, each a soft, low-saturation tone.

What makes these colours dull?

Low saturation. The tool keeps the intensity down while giving the colour a definite hue, so each result is muted and soft rather than vivid.

Are dull colours the same as pastels?

No. A dull colour is muted at an ordinary brightness, while a pastel is pale and light. A dusty blue is dull; a baby blue is pastel.

How do I stop a muted palette looking flat?

Let one colour be a slightly stronger accent, or use clear differences in lightness between the tones, so the scheme keeps some structure.

References

1. World Wide Web Consortium (W3C), CSS Color Module Level 4. https://www.w3.org/TR/css-color-4/
2. Colorfulness, saturation and how intense a colour is. Wikipedia. https://en.wikipedia.org/wiki/Colorfulness
3. TinyColor (Brian Grinstead). Documentation. https://github.com/bgrins/TinyColor