Petrol Loft color palette — #F6EDE0 · #8CBEAB · #266AAD · #004E59 · #1A2B56
Slate and Navy set the tone — five colors that lean into trust and stability.
The five colors
- Cream (#F6EDE0): a clean, paper-quiet neutral.
- Mint Leaf (#8CBEAB): A luminous, dusty teal — the color of shallow lagoons.
- Slate (#266AAD): A full-bodied, balanced blue — the color of a favorite pair of jeans.
- Deep Teal (#004E59): A deep, shadowed, dusty blue — the color of open sky before noon.
- Navy (#1A2B56): A deep, shadowed, balanced violet — the color of twilight just after sunset.
Feels like: Trust, Stability, Creativity, Calm, Balance. 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
- Tempered Petrol color palette (#F5EDE2, #9CBB9B, #007683, #00523D, #003343)
- Muted Alley color palette (#FAF4EB, #9DD2C3, #5C78AB, #005C73, #31365F)
- Patina Boulevard color palette (#F1E7DF, #8BBAD7, #4468B3, #004C47, #19063B)
- Cerulean Field color palette (#D9F4F9, #009EC0, #006891, #003F6A, #03265C)
- Hushed Lilac Orchard color palette (#CEFCEE, #ADBBF9, #A687CD, #006785, #3E253F)
- Worn Cerulean color palette (#F1E9DC, #4A9CB4, #005071, #003030, #00142B)
- Misty Periwinkle color palette (#E8F2E9, #A4DBFD, #53A9FF, #008EA1, #1D2C50)
- Dusty Loft color palette (#C7E7DE, #006FB6, #A81D4D, #3D5700, #00213B)
Browse the whole catalog at Explore, or see today's palette.