Tempered Shell color palette — #FBF1FD · #FAAABC · #4975A2 · #4E3A52 · #261F27

Built around Ballet Pink, softened by Slate — the whole palette hums with trust and stability.

The five colors

• Ivory (#FBF1FD): bright and airy, almost weightless.
• Ballet Pink (#FAAABC): A whisper-light, balanced red — the color of embers at dusk.
• Slate (#4975A2): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Charcoal (#4E3A52): A deep, shadowed, dusty pink — the color of neon signs at night.
• Onyx (#261F27): a grounded near-black with real depth.

Feels like: Trust, Stability, Sophistication. Tagged luxury, dark, muted.

Use it as a design system

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

• Patina Sand color palette (#FDF1FB, #FBC49E, #6C7CA5, #5A4656, #31282F)
• Patina Shell Pier color palette (#EAFAF0, #FFAAA3, #287D94, #2A4A39, #18251E)
• Worn Mint color palette (#FAE8F6, #80C983, #4B5EA2, #462A41, #1E111B)
• Muted Villa color palette (#ECD6E8, #8FB441, #334EA0, #1A2749, #150513)
• Cerulean Pier color palette (#EEF8F5, #E3D4CD, #A4A293, #6C94B8, #3D4B47)
• Petrol Veranda color palette (#EDF9F0, #D6DAAD, #54A2B2, #0A6F7F, #17261C)
• Hushed Blush color palette (#F0F8F1, #6DD7E1, #C86F8D, #249099, #311E1C)
• Washed Courtyard color palette (#EAF8FE, #9AB98C, #005C68, #00353C, #151C26)

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