Petrol Loft color palette — #F0F7F2 · #CDDDDC · #9CBCAF · #007081 · #343D37

Teal takes the lead with Ash close behind in a set that reads as trust and stability at first glance.

The five colors

• Ivory (#F0F7F2): bright and airy, almost weightless.
• Silver (#CDDDDC): a clean, paper-quiet neutral.
• Ash (#9CBCAF): A luminous, dusty teal — the color of glacier melt.
• Teal (#007081): A full-bodied, balanced blue — the color of deep harbor water.
• Charcoal (#343D37): a grounded near-black with real depth.

Feels like: Trust, Stability, Sophistication. Tagged scandi, muted, light.

Use it as a design system

One click turns Petrol Loft 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

• Aged Petrol color palette (#F9F3F8, #E6D4D7, #C1ACB9, #486492, #423641)
• Cypress Balcony color palette (#EDF4EE, #C4DCDD, #C1B1C0, #00727B, #18241B)
• Abyss Study color palette (#E9F0EC, #ACBEB6, #6B998C, #004C61, #11241B)
• Driftwood Canyon color palette (#F9F3F8, #E1D7D8, #B4ACA0, #977591, #585056)
• Wandering Workshop color palette (#F5F6EA, #7AA87F, #007646, #165748, #343A00)
• Tempered Balcony color palette (#DAE7E3, #B5A2B5, #6D7EA9, #003A61, #021813)
• Azure Courtyard color palette (#E8FAF1, #3DD4EC, #07B1EE, #2C73C0, #03392C)
• Moonless Petrol Hollow color palette (#D9ECE5, #006A99, #331C36, #031812, #010505)

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