Tempered Petrol color palette — #FBF2F9 · #EBE9B2 · #6475A3 · #482E43 · #160B14

Built around Slate, softened by Celadon Mist — the whole palette hums with nature and growth.

The five colors

• Ivory (#FBF2F9): bright and airy, almost weightless.
• Celadon Mist (#EBE9B2): A whisper-light, dusty green — the color of new leaves after rain.
• Slate (#6475A3): A full-bodied, dusty violet — the color of wild irises.
• Charcoal (#482E43): A deep, shadowed, dusty pink — the color of a candy shop window.
• Ink (#160B14): A deep, shadowed, dusty pink — the color of neon signs at night.

Feels like: Nature, Growth, Creativity, Sophistication. 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

• Driftwood Terrace color palette (#FEF1F7, #D7F9DC, #9F798D, #593C4B, #21181D)
• Ancient Cobalt color palette (#EBF9F4, #FFDCD6, #477BA7, #1A4037, #00140F)
• Byzantium Bloom color palette (#FFF1F5, #86F1C8, #8352A0, #3F1A52, #160007)
• Iris Drift color palette (#F1F5FE, #E8D3A8, #858FD1, #596088, #1A2133)
• Denim Harbor color palette (#FBEDF6, #C8B07E, #484E8A, #371D30, #140810)
• Antique Amber Corridor color palette (#FEF0FE, #87B5F0, #C79255, #008579, #2D1F2E)
• Hushed Driftwood color palette (#F1F9E6, #C4C5FF, #BD7B90, #297163, #432931)
• Ancient Iris color palette (#FAF2F9, #DFD8F3, #DD8360, #6685D9, #1E0E04)

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