Tempered Petrol color palette — #F0F6FB · #D9DAE4 · #C1BDCF · #327DA1 · #40494F
Cerulean takes the lead with Stone close behind in a set that reads as trust and stability at first glance.
The five colors
- Ivory (#F0F6FB): a clean, paper-quiet neutral.
- Silver (#D9DAE4): bright and airy, almost weightless.
- Stone (#C1BDCF): A luminous, dusty violet — the color of a velvet chair.
- Cerulean (#327DA1): A full-bodied, balanced blue — the color of open sky before noon.
- Charcoal (#40494F): quiet, heavy and certain.
Feels like: Trust, Stability, Sophistication. Tagged scandi, muted, light.
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
- Hushed Canyon color palette (#F2F5FE, #E3D5E8, #BEB7D4, #685EA7, #3C3F4B)
- Worn Delta color palette (#E1F1FF, #A6B8DD, #8480A2, #576C54, #375554)
- Navy Dune color palette (#DFE8F1, #9EAABD, #737E9F, #003B5F, #091520)
- Dusty Lantern color palette (#EFF8F3, #E1D3D0, #A6A093, #719A85, #414A45)
- Worn Lagoon Study color palette (#EDF8F6, #86BEA5, #008679, #356073, #29494A)
- Antique Boulevard color palette (#EEF6FF, #C9D3E7, #A99ECF, #0058AD, #273444)
- Iris Orchard color palette (#EEF6FF, #A2EAFF, #90C0FF, #8E7CD5, #283956)
- Weathered Aubergine color palette (#ECEBF6, #BDB4C9, #9A86A1, #62266E, #201C2D)
Browse the whole catalog at Explore, or see today's palette.