Tempered Cobalt color palette — #FDF3EE · #ABD0B5 · #2181B4 · #006342 · #4C2F48

Built around Cerulean, softened by Pine — the whole palette hums with nature and growth.

The five colors

• Ivory (#FDF3EE): bright and airy, almost weightless.
• Pistachio (#ABD0B5): A whisper-light, dusty teal — the color of shallow lagoons.
• Cerulean (#2181B4): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Pine (#006342): A full-bodied, balanced teal — the color of sea glass.
• Charcoal (#4C2F48): A deep, shadowed, dusty pink — the color of neon signs at night.

Feels like: Nature, Growth, Trust, Stability, Sophistication. Tagged coastal, cool, light, muted.

Use it as a design system

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

• Antique Cobalt color palette (#FCF4EB, #A1CBEA, #5771CA, #00605E, #4F2F3E)
• Airy Forest color palette (#FFF2EE, #71C9C7, #007A97, #005B1A, #003460)
• Cerulean Delta color palette (#EBF5ED, #93D4E0, #2E87A7, #005C55, #072237)
• Soft Sapphire Atelier color palette (#F7ECE2, #8EBDAC, #395FC7, #00504C, #30264D)
• Chalky Grove color palette (#F4DCF3, #3A77D7, #567A00, #00673E, #392239)
• Dusty Azure Station color palette (#FCF4E8, #B6E0C3, #3BA2C8, #1E7B73, #1B4338)
• Weathered Turquoise Pier color palette (#FBF3F0, #CBE8E3, #67A1C3, #427D5E, #5D4C5B)
• Blush Coast color palette (#FFF0FB, #F1D0FF, #EF8DA0, #1B7D8E, #57394A)

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