Petrol Ridge color palette — #F0F6FB · #DAD9E3 · #C4BCD4 · #447AA1 · #404951

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

The five colors

• Ivory (#F0F6FB): a clean, paper-quiet neutral.
• Silver (#DAD9E3): a clean, paper-quiet neutral.
• Ash (#C4BCD4): A luminous, dusty violet — the color of twilight just after sunset.
• Slate (#447AA1): A full-bodied, balanced blue — the color of deep harbor water.
• Charcoal (#404951): quiet, heavy and certain.

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

• Aged Pier color palette (#ECF3F9, #D9D7E5, #C3BAC6, #4C7B96, #252D34)
• Wandering Indigo color palette (#F3F4FF, #DFD5E1, #C0B7D1, #7358AA, #3C3E50)
• Patina Lagoon color palette (#EEF8F4, #E3D3CE, #A6A193, #6097B6, #404A46)
• Tempered Ash Lantern color palette (#E5F0FF, #A4ADD4, #8681A0, #4E6B4E, #365548)
• Ancient Navy color palette (#E1EAF5, #9EAABF, #757DA2, #00376B, #071523)
• Dusty Olive color palette (#EEF8F0, #B6B283, #697D2E, #3F5E70, #33483D)
• Dusty Ultramarine Lagoon color palette (#F1F5FD, #CCD2E3, #B09CCA, #204EC1, #293344)
• Patina Market color palette (#DCE5F4, #4E67CE, #352B4E, #181F2C, #0C0C12)

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