Vivid Complementary Color Palettes: 8 Examples With Hex Codes
Vivid palettes in a complementary scheme: eight real examples with hex codes and contrast, when the look works, and how to adapt it.
Vivid palettes follow a recipe: lightness between 52% and 82%, and chroma between 0.15 and 0.26. 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 bright, electric 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 vivid complementary palettes
Bold Tangerine Bazaar
Strongest pair: Rajah (#FBAB6F) with Olivia (#9B5B1A) at 2.85:1 (Fail). Keep these for large type and decoration.
Bold Iris Quarry
Strongest pair: Paella (#D7CF0B) with Bimi Green (#6A6715) at 3.59:1 (AA large). Keep these for large type and decoration.
Lively Green Bazaar
Strongest pair: Limonana (#59E252) with Poblano (#007C0C) at 3.19:1 (AA large). Keep these for large type and decoration.
Bold Rose Ember
Strongest pair: Aquamarine (#5DE7A8) with Opal Green (#057B61) at 3.35:1 (AA large). Keep these for large type and decoration.
Bright Chocolate Echo
Strongest pair: Clear Sky (#90CCFA) with Matt Blue (#0F70AF) at 3.08:1 (AA large). Keep these for large type and decoration.
Bold Violet Haven
Strongest pair: Testosterose (#EDA5FB) with Magentle (#A71CAF) at 3.31:1 (AA large). Keep these for large type and decoration.
Lively Tangerine Horizon
Strongest pair: Fish Pond (#6ECCFA) with Hydra (#016D99) at 3.20:1 (AA large). Keep these for large type and decoration.
Bright Fuchsia Nomad
Strongest pair: Aquamarine (#64E39A) with Opal Green (#187C4E) at 3.22:1 (AA large). Keep these for large type and decoration.
The eight at a glance
| Palette | Lightest | Darkest | Strongest pair |
|---|---|---|---|
| Bold Tangerine Bazaar | #FBAB6F | #9B5B1A | 2.85:1 |
| Bold Iris Quarry | #D7CF0B | #6A6715 | 3.59:1 |
| Lively Green Bazaar | #59E252 | #007C0C | 3.19:1 |
| Bold Rose Ember | #5DE7A8 | #057B61 | 3.35:1 |
| Bright Chocolate Echo | #90CCFA | #0F70AF | 3.08:1 |
| Bold Violet Haven | #EDA5FB | #A71CAF | 3.31:1 |
| Lively Tangerine Horizon | #6ECCFA | #016D99 | 3.20:1 |
| Bright Fuchsia Nomad | #64E39A | #187C4E | 3.22:1 |
How vivid differs from its neighbors
Vivid keeps lightness within 52% to 82%. Pastel runs from 80% to 96% with chroma 0.03 to 0.08, while Muted runs from 48% to 84% with chroma 0.035 to 0.09. That is why vivid palettes feel bright, electric, bold: the numbers are tuned that way, not chosen palette by palette.
When to use this look
- Book covers, which usually want to feel expressive and genre-aware.
- Real estate sites, which usually want to feel trustworthy and established.
- Tech blogs, which usually want to feel clear and modern.
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.