Morandi color palettes
Morandi is not a fixed set of colors but a way of handling them: pull saturation down, mix in some gray, keep the lightness values close together. The colors stop competing and the surface goes quiet. The library tags 7 palettes as Morandi; filtering by primary saturation leaves 3 that are genuinely muted, shown here with their measured numbers.
Morandi palettes in the library
Each card shows the primary, its saturation, and the measured contrast of body text against its background. Graying everything out into one flat wash is the usual failure, and that number is how you catch it.
Another 4 palettes carry the Morandi tag, but their primary saturation reaches 0 percent, past the 55 percent ceiling used here, so they sit outside the main row: Amethyst Veil, Jade Pool, Warm Ember, Rosewood. A tag is a tag and saturation is saturation. They are linked so you can judge for yourself.
What Morandi actually means
It comes from Giorgio Morandi, who spent a life painting the same bottles and jars in a permanently grayed key. The word later attached itself to palettes with low saturation, close lightness values and a veil of gray. What matters is not the hue but the fact that all three have been pushed down.
So a Morandi blue and a Morandi pink can sit far apart on the wheel; the only thing they share is having been grayed. To judge whether a palette qualifies, do not look at which colors you used, look at whether two colors placed together compete.
Three rules
One: keep a real lightness gap
Low saturation makes colors resemble each other, so lightness becomes the only source of hierarchy. Text and background have to be pulled hard apart: across these 3 palettes the lowest body contrast is 13.49:1 and the highest 14.67:1, all above AAA. Swatches may sit close together; text may not.
Two: allow one saturated point
Inside a muted set, one slightly louder color (gold, brick, teal) as the action color gives the screen a center of gravity. Two of them fight, and the Morandi calm disappears. That point usually lands on a button or a price, and should cover well under five percent of the screen.
Three: add air, not colors
When it feels flat, the reflex is to mix in another color. The answer here is whitespace, hairline borders, a little paper texture, with the color count unchanged. The more colors you add, the less the low saturation does for you.
Morandi is not the same as plain gray
The two labels get used interchangeably, but only 6 palettes in the library carry both. The difference is what each one gives up: a straight gray palette only asks that nothing glares, and the hues may run cold and hard. Morandi adds a second judgment, warm undertone inside the gray and a narrowed lightness band, which makes it better for screens people stay on, while plain gray suits dense dashboards.
When not to use it
- Anything that needs arousal: sales, games, limited-time offers. Low saturation is calm by nature and cannot manufacture urgency; a button in it does not read as buy now.
- Interfaces where state is carried by color alone. Low saturation makes red and green blend faster; if you must, run the color blindness simulator first.
- Small screens in daylight. Muted tones lose contrast faster on dim displays, and body text is the first thing to go.
Common questions
- Is a Morandi palette a fixed set of hex values?
- No. It is a treatment (lower saturation, add gray, narrow the lightness range), not a swatch card, which is why two Morandi palettes can be built from entirely different hues.
- Why does a Morandi palette look expensive?
- Because it removes competition between colors. When the eye scans a surface, saturation difference is the dimension that grabs attention first; push it down and the visual load drops, which people describe as clean or premium.
- Can a Morandi palette work in dark mode?
- Yes, but it has to be recomputed: muted colors read darker on a dark surface, so the primary usually needs a lift. Run it through the dark mode converter, which prints the measured contrast of every pair.
Related tools
Contrast checker →Color blindness simulator →Dark mode converter →See every palette tagged Morandi →