Tempered Harbor color palette — #FCF3ED · #C4E9EA · #A0BEF4 · #55A9A0 · #5B3D4D

A conversation between Sky and Turquoise, giving this palette its sense of sophistication and softness.

The five colors

• Ivory (#FCF3ED): bright and airy, almost weightless.
• Frost (#C4E9EA): A whisper-light, dusty teal — the color of shallow lagoons.
• Sky (#A0BEF4): A luminous, balanced violet — the color of a velvet chair.
• Turquoise (#55A9A0): A luminous, balanced teal — the color of sea glass.
• Cocoa (#5B3D4D): A deep, shadowed, dusty rose — the color of strawberry cream.

Feels like: Sophistication, Softness, Clarity. Tagged coastal, cool, light, muted.

Use it as a design system

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

• Chalky Teal color palette (#FFF2E9, #C1F1DB, #87B8FF, #00A795, #3C3670)
• Hushed Harbor color palette (#FFF1F6, #C7ADFF, #96C47C, #61AD8E, #4C2D3B)
• Ancient Pier color palette (#FFF0F8, #C3F3E7, #E6D7CF, #94BDDD, #5F444A)
• Timeworn Cerulean color palette (#F0F7F2, #D5DCF5, #7EA9D5, #268898, #384862)
• Pale Lilac Loft color palette (#BAEFDC, #B4C9FF, #A897E5, #986EAE, #623B57)
• Dusty Cobalt color palette (#F2E4DC, #69ABC0, #2878BC, #005F4C, #06002B)
• Weathered Iris color palette (#F7EFF3, #C5E0F5, #678CD5, #006D66, #262A41)
• Airy Pier color palette (#F0E3D4, #7DB7E5, #6077E9, #006D6E, #1D0039)

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