Tempered Petrol color palette — #D7EFE8 · #0069AA · #655300 · #413500 · #000B07
Built around Peacock, softened by Coffee — the whole palette hums with nature and growth.
The five colors
- Honeydew (#D7EFE8): A whisper-light, dusty teal — the color of sea glass.
- Peacock (#0069AA): A full-bodied, balanced blue — the color of deep harbor water.
- Coffee (#655300): A full-bodied, balanced green — the color of a quiet forest floor.
- Espresso (#413500): A deep, shadowed, dusty green — the color of a quiet forest floor.
- Ink (#000B07): A deep, shadowed, dusty teal — the color of shallow lagoons.
Feels like: Nature, Growth, Trust, Stability, Optimism, 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
- Ultramarine Harbor color palette (#F7E8F8, #0064BA, #724D00, #00412F, #000717)
- Velvet Pier color palette (#C9E6D8, #005B76, #5B3D00, #002F26, #000304)
- Ancient Mulberry color palette (#D7EBD8, #007375, #A10028, #413500, #000B01)
- Chalky Veranda color palette (#CAE1F9, #0085D9, #896E00, #645000, #031C32)
- Misty Cobalt Coast color palette (#F5E2F6, #4488D2, #8A3900, #294F00, #170A19)
- Hushed Sapphire color palette (#F5E0F2, #325FD9, #880015, #033105, #000E0D)
- Pale Ultramarine Market color palette (#EBD6EB, #005DC4, #822C6B, #004236, #261227)
- Linen Amethyst Market color palette (#FFE3F1, #7230F3, #6A5B00, #00463D, #0C0325)
Browse the whole catalog at Explore, or see today's palette.