Tempered Petrol color palette — #F2F7EF · #59C4B0 · #466FAC · #007060 · #2B1F2B

Slate and Mint Leaf set the tone — five colors that lean into trust and stability.

The five colors

• Ivory (#F2F7EF): a clean, paper-quiet neutral.
• Mint Leaf (#59C4B0): A luminous, balanced teal — the color of sea glass.
• Slate (#466FAC): A full-bodied, balanced blue — the color of deep harbor water.
• Teal (#007060): A full-bodied, balanced teal — the color of glacier melt.
• Onyx (#2B1F2B): A deep, shadowed, dusty pink — the color of neon signs at night.

Feels like: Trust, Stability, Calm, Sophistication. Tagged duotone, muted, cool.

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 Petrol color palette (#EEF8F3, #6BBADB, #75639E, #006989, #321C26)
• Muted Delta color palette (#F0F3EC, #84C49D, #7168B7, #007848, #1A0712)
• Hushed Garden color palette (#F4F7EC, #83C089, #007E86, #217232, #1B281D)
• Turquoise Bloom color palette (#FFF4E2, #33A9B7, #426E95, #77373C, #224634)
• Wandering Archive color palette (#EBF8F8, #9AD4AF, #9481CC, #00995A, #202334)
• Cypress Ridge color palette (#F1F7F1, #D2DCDB, #AFC3C5, #268387, #414B42)
• Navy Dune color palette (#BDFFFD, #6ABACD, #2484AA, #114F88, #22307E)
• Aubergine Station color palette (#D4E8DD, #00657E, #2E006E, #00212C, #060003)

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