Worn Petrol color palette — #D3E9D7 · #83B19A · #4E7A99 · #604E72 · #5A353D

A conversation between Slate and Charcoal Brown, giving this palette its sense of trust and stability.

The five colors

• Honeydew (#D3E9D7): A whisper-light, dusty teal — the color of shallow lagoons.
• Sage (#83B19A): A luminous, dusty teal — the color of sea glass.
• Slate (#4E7A99): A full-bodied, dusty blue — the color of a favorite pair of jeans.
• Charcoal Brown (#604E72): A full-bodied, dusty violet — the color of a velvet chair.
• Cocoa (#5A353D): A deep, shadowed, dusty red — the color of embers at dusk.

Feels like: Trust, Stability, Sophistication. Tagged vintage, retro, muted.

Use it as a design system

One click turns Worn 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

• Petrol Garden color palette (#E3E2C0, #99AD90, #3A7890, #6C4039, #372000)
• Softworn Lagoon color palette (#E0EAC1, #98AB86, #428782, #674C6A, #3C466C)
• Weathered Powder color palette (#D3E7ED, #98C8DF, #85AAC6, #777DA0, #484561)
• Mulberry Workshop color palette (#B8EBDC, #BB9ABA, #83677A, #794364, #5B3631)
• Airy Garnet Alley color palette (#CBF2E2, #6086AF, #49558B, #5D1853, #401129)
• Worn Dune color palette (#E4FCF2, #C6B0C7, #A07E97, #7B5471, #654946)
• Muted Turquoise color palette (#D4E7E7, #0AABB7, #007383, #00576A, #004154)
• Tempered Cocoa Harbor color palette (#F1E7FF, #AE8892, #895D7C, #663520, #3B2E00)

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