Tempered Courtyard color palette — #FFF2ED · #FC4153 · #5F2A0D · #250E06 · #050100

Built around Scarlet, softened by Cocoa — the whole palette hums with optimism and warmth.

The five colors

• Ivory (#FFF2ED): bright and airy, almost weightless.
• Scarlet (#FC4153): A luminous, vivid orange — the color of autumn markets.
• Cocoa (#5F2A0D): A deep, shadowed, balanced orange — the color of toasted spice.
• Ink (#250E06): A deep, shadowed, dusty orange — the color of autumn markets.
• Black (#050100): A deep, shadowed, dusty gold — the color of afternoon light on wheat.

Feels like: Optimism, Warmth, Comfort, Energy, Balance. Tagged noir, dark, luxury, vibrant.

Use it as a design system

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

• Amber Boulevard color palette (#FFF3E9, #DE6E00, #513600, #240F00, #040100)
• Tempered Coral color palette (#F6DBD2, #FF6673, #845E37, #543B32, #1A0D0E)
• Chalky Terrace color palette (#FFF1F1, #FB1BAB, #63232D, #270B0C, #050001)
• Deep Coast color palette (#FDDECF, #D82400, #3B1B00, #0E1209, #0A0200)
• Shadow Chestnut Market color palette (#EEDCCF, #934800, #27332F, #1B1000, #030100)
• Bronze Basin color palette (#FFEBCB, #9D7800, #2C2E00, #0D1717, #0C0700)
• Soft Lantern color palette (#FFF3E7, #F89202, #00B6A5, #9F60E4, #341A00)
• Weathered Courtyard color palette (#F9F5EB, #C2AF51, #5F5600, #302A1E, #120F0A)

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