Petrol Ridge color palette — #EFF7F9 · #D5DCE7 · #B9C0CF · #3F8085 · #3D4A4F

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

The five colors

• Ivory (#EFF7F9): bright and airy, almost weightless.
• Silver (#D5DCE7): a clean, paper-quiet neutral.
• Ash (#B9C0CF): A luminous, dusty violet — the color of a velvet chair.
• Slate (#3F8085): A full-bodied, dusty blue — the color of deep harbor water.
• Charcoal (#3D4A4F): 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 Ridge 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 Villa color palette (#F1F6FC, #DAD8E9, #ACBBE2, #416AA9, #39404A)
• Tempered Driftwood color palette (#F1F7F0, #CEE1E0, #D6C4CA, #7C987B, #434A43)
• Abyss Balcony color palette (#DFE6EA, #9BACB6, #65839A, #003F49, #04161E)
• Pewter Dune color palette (#EEF6FF, #AABBD6, #7E88A7, #725F81, #554858)
• Pine Garden color palette (#E8FAF4, #9CBA8F, #4A834F, #396263, #2C4944)
• Dusty Bloom color palette (#EAEFF7, #C5CCDD, #999FB8, #364E9A, #252E3D)
• Pale Aqua Loft color palette (#EAF7FF, #85F9FF, #00CFF6, #4E99D6, #25465A)
• Misty Petrol color palette (#DDFDFA, #31A7C4, #0E71A4, #5D3E71, #254151)

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