Tempered Petrol color palette — #E3F0FE · #F19B85 · #2B65A4 · #15365B · #0C1722

Built around Peacock, softened by Melon — the whole palette hums with trust and stability.

The five colors

• Frost (#E3F0FE): A whisper-light, dusty blue — the color of deep harbor water.
• Melon (#F19B85): A luminous, balanced orange — the color of toasted spice.
• Peacock (#2B65A4): A full-bodied, balanced blue — the color of open sky before noon.
• Navy (#15365B): A deep, shadowed, dusty blue — the color of open sky before noon.
• Ink (#0C1722): A deep, shadowed, dusty blue — the color of deep harbor water.

Feels like: Trust, Stability, Balance. Tagged luxury, dark, 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

• Worn Dune color palette (#EFF6FF, #E4BD8B, #4970B5, #2F4264, #19222F)
• Hushed Villa color palette (#E9F9F4, #FFBEA9, #216998, #002B45, #000503)
• Pale Terrace color palette (#DEECFD, #D57631, #004090, #00183F, #00020A)
• Softworn Amber color palette (#E3F3EC, #C39304, #004967, #00291D, #041314)
• Patina Study color palette (#F1F5FB, #DCD7E1, #CDB7C8, #6080B8, #353B44)
• Washed Cerulean color palette (#E4F1F9, #A8D7A7, #3E93B4, #335B73, #0A1820)
• Misty Atelier color palette (#DAE5F9, #B3B200, #3040D7, #151E75, #030E26)
• Hushed Harbor color palette (#DBDDEC, #29BF95, #6536A1, #2F1D4B, #08081C)

Browse the whole catalog at Explore, or see today's palette.