Palette

Morning Chai Spice

Warm and aromatic, like a comforting cup of spiced chai on a chilly morning.

WarmCalm5 colors

More Warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Morning Chai Spice reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Morning Chai Spice.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#6F4F28#8B4513#CC7722#EEDDCC#FDF5E6

Palette guide

How to use Morning Chai Spice

Overview

The Morning Chai Spice palette is a warm and aromatic collection of colors, reminiscent of a comforting cup of spiced chai on a chilly morning. Featuring deep browns like #6F4F28, a rich cinnamon brown #8B4513, a vibrant orange-brown #CC7722, and soft creamy whites #EEDDCC and #FDF5E6, this palette is ideal for creating designs that feel cozy, inviting, and rich with flavor. It's a perfect choice for brands and projects that aim to communicate warmth, comfort, and a touch of exotic spice, whether in digital interfaces, print materials, or culinary branding.

Best used for

Spice and gourmet food product packaging
Autumn-themed event branding and decor
Cozy cafe and restaurant menus
Comfort food blogs and recipe websites
Artisanal craft and handmade goods marketing
Cultural or travel-related content

Suggested color roles

primary

Use #8B4513 for main headings, key calls to action, or prominent graphical elements to establish a rich, inviting focus.

secondary

Apply #CC7722 for sub-headings, secondary buttons, or accent elements that need a vibrant, spicy pop.

accent

Utilize #6F4F28 for strong calls to action, important icons, or backgrounds where a deep, grounding contrast is desired.

background

Employ #FDF5E6 as the primary background color, providing a soft, warm, and clean canvas that enhances legibility.

text

For optimal readability on lighter backgrounds, use #6F4F28 for body text and headings, offering strong, deep contrast.

Accessibility notes

Ensure sufficient contrast between text and background, especially when using #EEDDCC for text on #FDF5E6.
For interactive elements, make sure their color, such as #8B4513 or #CC7722, stands out clearly against surrounding elements.
Avoid placing #6F4F28 and #8B4513 adjacent for critical information due to their close dark values, without sufficient differentiation.
Always test text legibility of light text on #6F4F28, #8B4513, or #CC7722 backgrounds to meet WCAG contrast standards.

Recommended combinations

Spiced Blend

Creates a rich, flavorful gradient of spice tones, ideal for infographics or showcasing product variations.

#6F4F28 · #8B4513 · #CC7722

Creamy Chai

Offers a soft, comforting blend with a strong brown anchor, perfect for header sections or testimonials.

#EEDDCC · #FDF5E6 · #8B4513

Autumn Warmth

Provides a vibrant, inviting combination with creamy accents, suitable for call-to-action sections or seasonal promotions.

#CC7722 · #8B4513 · #FDF5E6

CSS variables

:root {
  --morning-chai-spice-1: #6F4F28;
  --morning-chai-spice-2: #8B4513;
  --morning-chai-spice-3: #CC7722;
  --morning-chai-spice-4: #EEDDCC;
  --morning-chai-spice-5: #FDF5E6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "morning-chai-spice": {
        1: "#6F4F28",
        2: "#8B4513",
        3: "#CC7722",
        4: "#EEDDCC",
        5: "#FDF5E6",
      }
    }
  }
}

Hex values

Color 1#6F4F28

Color 2#8B4513

Color 3#CC7722

Color 4#EEDDCC

Color 5#FDF5E6

Accessibility

Contrast checker

1:1Fail

2.2:1Fail

5.6:1AA

6.9:1AA

1:1Fail

2.1:1Fail

5.4:1AA

6.6:1AA

2.2:1Fail

2.1:1Fail

2.5:1Fail

3.1:1AA18

5.6:1AA

5.4:1AA

2.5:1Fail

1.2:1Fail

6.9:1AA

6.6:1AA

3.1:1AA18

1.2:1Fail

Similar palettes

More like Morning Chai Spice