Petrol Ridge color palette — #F5F4FF · #A175B0 · #B65C5A · #276BAD · #38344D

Slate and Brick set the tone — five colors that lean into trust and stability.

The five colors

• Ivory (#F5F4FF): bright and airy, almost weightless.
• Dusty Rose (#A175B0): A luminous, balanced pink — the color of neon signs at night.
• Brick (#B65C5A): A full-bodied, balanced orange — the color of toasted spice.
• Slate (#276BAD): A full-bodied, balanced blue — the color of deep harbor water.
• Navy (#38344D): A deep, shadowed, dusty violet — the color of wild irises.

Feels like: Trust, Stability, Creativity, Balance. Tagged warm.

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

• Aged Quarry color palette (#F7F3FF, #B687A8, #B47961, #5F71B8, #463E52)
• Wandering Coast color palette (#F1F5FF, #7D82C1, #AA5D89, #007689, #2E3750)
• Hushed Driftwood color palette (#F5F3FF, #EBD3E4, #F1B2AB, #8F66A3, #524960)
• Worn Balcony color palette (#F6F3FF, #D4A9D2, #935593, #671F69, #421D42)
• Softworn Grape color palette (#FCE1FF, #CF4A68, #986700, #7B32B9, #521A26)
• Timeworn Moss color palette (#F0F0FF, #A279C1, #6E8C03, #007F58, #1D1B2F)
• Ultramarine Archive color palette (#FDDCF3, #BD14A0, #A63E00, #2F1DE0, #430037)
• Muted Wisteria color palette (#FFF1F5, #C18BDE, #82A74B, #50986B, #492F37)

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