Tempered Sapphire Pier color palette — #E0E7F8 · #3457FF · #6B6800 · #305923 · #101E51

A conversation between Royal Blue and Olive, giving this palette its sense of nature and growth.

The five colors

• Frost (#E0E7F8): A whisper-light, dusty violet — the color of a velvet chair.
• Royal Blue (#3457FF): A full-bodied, vivid violet — the color of a velvet chair.
• Olive (#6B6800): A full-bodied, balanced green — the color of new leaves after rain.
• Deep Olive (#305923): A full-bodied, balanced green — the color of new leaves after rain.
• Deep Indigo (#101E51): A deep, shadowed, balanced violet — the color of wild irises.

Feels like: Nature, Growth, Creativity, Energy, Balance. Tagged vibrant.

Use it as a design system

One click turns Tempered Sapphire Pier 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

• Indigo Parlor color palette (#E9EDFE, #5959E7, #B03200, #00623A, #090038)
• Ancient Amethyst color palette (#E7DFFF, #7C2FDC, #006948, #004931, #251243)
• Washed Petrol color palette (#CAE7F8, #007AAB, #865A00, #534F00, #00283B)
• Aged Orchard color palette (#E5E9FF, #7279FF, #DE4100, #00844F, #1A155C)
• Misty Meadow color palette (#F4EBF8, #A427CD, #596E00, #055D2F, #360D44)
• Hazy Thicket color palette (#F2E5FF, #B26BED, #3E7000, #005D41, #3A264B)
• Worn Olive Hollow color palette (#FFF0F7, #9A8DC9, #938B50, #5C7C44, #513B46)
• Gentle Coral color palette (#F1F5FF, #E3BDF9, #E48285, #00748E, #312B59)

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