Tempered Petrol color palette — #F5EBF3 · #81BDC4 · #00719B · #005330 · #1C2D4D

A conversation between Peacock and Deep Olive, giving this palette its sense of nature and growth.

The five colors

• Blush (#F5EBF3): bright and airy, almost weightless.
• Ash (#81BDC4): A luminous, dusty blue — the color of deep harbor water.
• Peacock (#00719B): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Deep Olive (#005330): A deep, shadowed, balanced teal — the color of shallow lagoons.
• Midnight (#1C2D4D): A deep, shadowed, dusty violet — the color of a velvet chair.

Feels like: Nature, Growth, Trust, Stability, 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

• Patina Sapphire Summit color palette (#F9EAF0, #93B6D2, #4161BA, #00504D, #30274A)
• Tempered Petrol color palette (#EEE8DF, #76C1CA, #007791, #004C42, #001826)
• Softworn Cerulean color palette (#E7F2E9, #89D3DB, #0095B5, #006D5F, #003249)
• Cornflower Hollow color palette (#FFF1F7, #A7D6F0, #497BDA, #006760, #403961)
• Airy Archive color palette (#CBF6EF, #8FD8CA, #14A2F0, #685D00, #133E3E)
• Turquoise Coast color palette (#FBEBE3, #9DE1E8, #19B4E4, #009471, #003054)
• Worn Azure color palette (#F9F3F7, #D4E1F3, #61A1CB, #427C62, #475368)
• Softworn Nightshade color palette (#E6F3E4, #5C94C7, #3534A7, #002F32, #1E0036)

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