Tempered Petrol color palette — #F5EDE2 · #96BC9F · #00748F · #005147 · #00324A

Teal and Forest set the tone — five colors that lean into nature and growth.

The five colors

• Cream (#F5EDE2): bright and airy, almost weightless.
• Sage (#96BC9F): A luminous, dusty teal — the color of glacier melt.
• Teal (#00748F): A full-bodied, balanced blue — the color of deep harbor water.
• Forest (#005147): A deep, shadowed, dusty teal — the color of sea glass.
• Deep Teal (#00324A): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.

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

• Cobalt Balcony color palette (#F5EDE2, #81B9DB, #006AB8, #004E58, #1D2C50)
• Turquoise Orchard color palette (#E5F1EF, #99E1EC, #43B5CF, #009190, #003343)
• Muted Lagoon color palette (#C8EDE5, #00A3A0, #00656C, #004352, #152644)
• Pale Iris color palette (#D9FBE6, #90CDF7, #8A95FC, #006866, #103A2E)
• Feathered Cerulean color palette (#F7EAF4, #8DD2DA, #0091C8, #0D6F45, #182C53)
• Aged Field color palette (#F8F5EF, #C6E9E5, #5DA3C2, #367C76, #375149)
• Lagoon Bloom color palette (#EBE0D0, #44A09C, #00545C, #003122, #00171F)
• Feathered Mulberry Station color palette (#C8EBD6, #00788F, #A10086, #5A4D00, #00242D)

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