Petrol Loft color palette — #F8EFF2 · #C3E0FE · #7A8BC0 · #006A7A · #262A41

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

The five colors

• Ivory (#F8EFF2): bright and airy, almost weightless.
• Powder Blue (#C3E0FE): A whisper-light, dusty blue — the color of a favorite pair of jeans.
• Slate Blue (#7A8BC0): A luminous, balanced violet — the color of twilight just after sunset.
• Peacock (#006A7A): A full-bodied, balanced blue — the color of deep harbor water.
• Midnight (#262A41): A deep, shadowed, dusty violet — the color of a velvet chair.

Feels like: Trust, Stability, Creativity, Calm, Sophistication. Tagged coastal, cool, light, muted.

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

• Muted Terrace color palette (#FAF4EE, #C6E4DB, #7C86BC, #007074, #5F3B49)
• Tempered Denim Basin color palette (#F1E1EB, #45ABC4, #005E8B, #003A32, #000825)
• Cerulean Market color palette (#F7EFF5, #8BD6DE, #0088AF, #005E47, #02223D)
• Timeworn Periwinkle color palette (#F9F4ED, #C5EFE4, #8BA5D7, #3F849D, #414468)
• Misty Coral color palette (#FEEBFF, #D36575, #009389, #09788C, #261927)
• Hushed Courtyard color palette (#EEDEE5, #0A83B0, #003B74, #001F1F, #01000B)
• Sunlit Blush color palette (#FCECFF, #E28397, #00A0AF, #94495A, #002C3A)
• Hushed Oat color palette (#FDEBFF, #D9DACA, #DEC991, #9F7897, #422D3B)

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