Muted Complementary Color Palettes: 8 Examples With Hex Codes
Muted palettes in a complementary scheme: eight real examples with hex codes and contrast, when the look works, and how to adapt it.
Muted palettes follow a recipe: lightness between 48% and 84%, and chroma between 0.035 and 0.09. Complementary describes how the hues relate. Opposite hues. High energy, best with one color leading and the other as an accent. Together, they give you a dusty, quiet look that you can recognize at a glance. Below are eight real examples from Tintly's library of generated palettes, each with its own page.
Eight muted complementary palettes
Weathered Taupe Lagoon
Strongest pair: Wizard (#4B5F8F) with Night Snow (#BAC8F5) at 3.80:1 (AA large). Keep these for large type and decoration.
Calm Beige Cascade
Strongest pair: Fizz (#C7D998) with Bimi Green (#556A31) at 3.95:1 (AA large). Keep these for large type and decoration.
Faded Slate Orchard
Strongest pair: Dark Blue (#2E6189) with Baby Blue (#A3CFFE) at 4.05:1 (AA large). Keep these for large type and decoration.
Faded Beige Glacier
Strongest pair: Monstera (#546542) with Fizz (#BDDBAC) at 4.18:1 (AA large). Keep these for large type and decoration.
Calm Teal Lagoon
Strongest pair: Slate (#496673) with Mr Freeze (#ADD1E2) at 3.78:1 (AA large). Keep these for large type and decoration.
Quiet Pine Velvet
Strongest pair: Nature (#C6D1A5) with Bimi Green (#53652B) at 4.00:1 (AA large). Keep these for large type and decoration.
Calm Slate Monsoon
Strongest pair: Dusk (#525688) with Innocent Snowdrop (#CDC7FD) at 4.32:1 (AA large). Keep these for large type and decoration.
Hushed Slate Wharf
Strongest pair: Persian Mosaic (#1A6E79) with Light Blue (#99DBEF) at 3.86:1 (AA large). Keep these for large type and decoration.
The eight at a glance
| Palette | Lightest | Darkest | Strongest pair |
|---|---|---|---|
| Weathered Taupe Lagoon | #BAC8F5 | #4B5F8F | 3.80:1 |
| Calm Beige Cascade | #C7D998 | #556A31 | 3.95:1 |
| Faded Slate Orchard | #A3CFFE | #2E6189 | 4.05:1 |
| Faded Beige Glacier | #BDDBAC | #546542 | 4.18:1 |
| Calm Teal Lagoon | #ADD1E2 | #496673 | 3.78:1 |
| Quiet Pine Velvet | #C6D1A5 | #53652B | 4.00:1 |
| Calm Slate Monsoon | #CDC7FD | #525688 | 4.32:1 |
| Hushed Slate Wharf | #99DBEF | #1A6E79 | 3.86:1 |
How muted differs from its neighbors
Muted keeps lightness within 48% to 84%. Pastel runs from 80% to 96% with chroma 0.03 to 0.08, while Vivid runs from 52% to 82% with chroma 0.15 to 0.26. That is why muted palettes feel dusty, quiet, faded: the numbers are tuned that way, not chosen palette by palette.
When to use this look
- Portfolios, which usually want to feel quiet and editorial.
- Luxury brands, which usually want to feel refined and restrained.
- Education sites, which usually want to feel friendly and clear.
How to adapt it
- Pick the example whose main color is closest to your brand.
- Open it in the generator and lock that color.
- Regenerate the rest until the contrast between text and background reaches 4.5 to 1.
- Export it as CSS variables or a Tailwind scale.