Muted Petrol color palette — #F6E5DE · #9DBDA2 · #00759E · #004E2C · #011338

A conversation between Slate and Forest, giving this palette its sense of nature and growth.

The five colors

• Rose Water (#F6E5DE): A whisper-light, dusty orange — the color of sun-warmed clay.
• Sage (#9DBDA2): A luminous, dusty green — the color of new leaves after rain.
• Slate (#00759E): A full-bodied, balanced blue — the color of open sky before noon.
• Forest (#004E2C): A deep, shadowed, balanced teal — the color of sea glass.
• Midnight (#011338): A deep, shadowed, dusty violet — the color of wild irises.

Feels like: Nature, Growth, Trust, Stability, Sophistication. Tagged coastal, cool, light, muted.

Use it as a design system

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

• Worn Petrol color palette (#F3E7DD, #86BCD6, #3A6AB2, #004C44, #16083C)
• Ancient Petrol Delta color palette (#F4EEE3, #9DBAA2, #00748C, #005145, #003248)
• Cobalt Dune color palette (#FAEFEA, #B0D1BB, #3E82B5, #005E45, #31142B)
• Gentle Cerulean color palette (#F4EBF3, #9ECDDE, #2491C1, #007042, #0F2A5F)
• Muted Veranda color palette (#ECF9EF, #ACF4FC, #11A2C2, #006B5D, #002232)
• Dusty Navy Veranda color palette (#EDE2DC, #4D8191, #003D6B, #002018, #01000B)
• Worn Cypress color palette (#F8F0EC, #C7E7E2, #79A898, #3E795F, #432F3F)
• Byzantium Corridor color palette (#F9E4FE, #9342A7, #006F58, #005258, #16001D)

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