Tempered Petrol color palette — #F3F7E9 · #499360 · #007BA6 · #395088 · #32342D
A conversation between Cerulean and Fern, giving this palette its sense of nature and growth.
The five colors
- Ivory (#F3F7E9): a clean, paper-quiet neutral.
- Fern (#499360): A luminous, balanced teal — the color of sea glass.
- Cerulean (#007BA6): A full-bodied, balanced blue — the color of a favorite pair of jeans.
- Peacock (#395088): A full-bodied, balanced violet — the color of twilight just after sunset.
- Espresso (#32342D): a grounded near-black with real depth.
Feels like: Nature, Growth, Trust, Stability, Creativity, Sophistication. Tagged 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
- Tempered Olive Garden color palette (#FAF5E2, #82882E, #008183, #005B79, #35332C)
- Linen Denim color palette (#E9F3DA, #008559, #0065A6, #5A3F00, #212A0F)
- Pale Indigo color palette (#EEF9EB, #00958D, #5768C0, #614084, #2A3728)
- Bronze Meadow color palette (#FBF1DF, #A58100, #5B71B3, #404F7F, #221806)
- Aged Moss color palette (#F8F5E8, #8F9746, #338E91, #854E43, #3F3D36)
- Patina Grape Boulevard color palette (#DFFEE9, #008598, #763AD1, #731C77, #12331F)
- Amber Dune color palette (#EBFAEE, #C89500, #848AC3, #65699D, #28372B)
- Hushed Olive color palette (#F6F5EF, #D6DED4, #B7C6B6, #6C7C3C, #4A483C)
Browse the whole catalog at Explore, or see today's palette.