Tempered Petrol color palette — #F1F7F2 · #CBDFF4 · #728ABA · #006D89 · #40446A
A conversation between Peacock and Slate Blue, giving this palette its sense of trust and stability.
The five colors
- Ivory (#F1F7F2): a clean, paper-quiet neutral.
- Powder Blue (#CBDFF4): A whisper-light, dusty blue — the color of deep harbor water.
- Slate Blue (#728ABA): A luminous, dusty violet — the color of a velvet chair.
- Peacock (#006D89): A full-bodied, balanced blue — the color of deep harbor water.
- Navy (#40446A): A full-bodied, dusty violet — the color of twilight just after sunset.
Feels like: Trust, Stability, Creativity, Calm, Sophistication. Tagged coastal, cool, light, muted.
Use it as a design system
One click turns Tempered Petrol into a complete token system: semantic roles from primary to success, an 11-stop OKLCH scale per role, a WCAG AA/AAA and APCA contrast matrix, an auto-derived dark mode and 11 export formats including CSS custom properties, Tailwind, Figma Variables and shadcn/ui.
Similar palettes
- Cypress Atelier color palette (#F1F7F2, #C8E1EA, #3C98AD, #007360, #2C4C61)
- Ancient Lagoon color palette (#EEF4ED, #C9DFF5, #7987D4, #006C70, #292941)
- Denim Corridor color palette (#DAE4DC, #6EA9B9, #005F82, #003E3C, #00213B)
- Tempered Navy color palette (#DBE3DC, #4D88A7, #003E6C, #002226, #000329)
- Periwinkle Loft color palette (#FAF4EE, #C3F0E3, #8D9EF1, #35898B, #5C3D4A)
- Tempered Petrol Harbor color palette (#E9FAEC, #7EC5D2, #00799B, #005650, #003655)
- Feathered Petrol color palette (#FFF0FE, #BE6E6F, #538C46, #3D67AE, #472E46)
- Antique Basin color palette (#FFF0FE, #F1D1D3, #E3BE8D, #AD6483, #624859)
Browse the whole catalog at Explore, or see today's palette.