Tempered Brick color palette — #FFDBD6 · #C30516 · #00675C · #00425E · #3B0D0B

Built around Ruby, softened by Pine — the whole palette hums with trust and stability.

The five colors

• Shell Pink (#FFDBD6): A whisper-light, dusty orange — the color of toasted spice.
• Ruby (#C30516): A full-bodied, vivid orange — the color of toasted spice.
• Pine (#00675C): A full-bodied, balanced teal — the color of shallow lagoons.
• Navy (#00425E): A deep, shadowed, dusty blue — the color of deep harbor water.
• Onyx (#3B0D0B): A deep, shadowed, dusty orange — the color of toasted spice.

Feels like: Trust, Stability, Warmth, Comfort, Energy, Balance. Tagged vibrant, warm.

Use it as a design system

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

• Pale Drift color palette (#F3DFD9, #C70041, #00667C, #004353, #1D0004)
• Terracotta Corridor color palette (#FFEBE0, #A53400, #00544D, #002D55, #2F0727)
• Pale Raspberry color palette (#FFDBD7, #CF277F, #0B590C, #00464C, #3C0521)
• Navy Balcony color palette (#FBDFC6, #9A5300, #00656D, #06289F, #321700)
• Worn Bronze Parlor color palette (#F7E2B7, #B56700, #5D5300, #003E56, #392400)
• Misty Raspberry Basin color palette (#F3DBFA, #F10A78, #0082B2, #006085, #3B091C)
• Bronze Hollow color palette (#F7EDDE, #916900, #006993, #453879, #31240E)
• Worn Amber Workshop color palette (#FDF3ED, #C8785F, #059385, #396484, #433B38)

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