Back to palettes

Palette

Cinnamon Bark Spice

Earthy, spicy oranges and browns reminiscent of warm cinnamon bark and autumn comforts.

warmnatural5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cinnamon Bark 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 Cinnamon Bark Spice.

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

Data visualization

#4a1e0b#7d3215#ad4925#d66945#ff8f6a

Palette guide

How to use Cinnamon Bark Spice

Overview

The Cinnamon Bark Spice palette is a vibrant collection of earthy, spicy oranges and browns, evoking the warmth of autumn. Ranging from the deep, grounded #4a1e0b to the bright, inviting #ff8f6a, this palette offers a rich spectrum for designers seeking a natural yet energetic feel. Mid-tones like #7d3215, #ad4925, and #d66945 provide a beautiful progression, perfect for creating depth and visual interest. Developers can utilize these hex codes to craft engaging UI elements, warm branding, or captivating digital art that resonates with comfort and natural spice. This palette is excellent for projects that aim to convey coziness, tradition, and the inviting spirit of the fall season.

Best used for

  • autumn seasonal marketing campaigns
  • food and beverage packaging (spices, baked goods)
  • cozy home decor websites
  • fall festival branding
  • rustic blog designs
  • outdoor adventure gear branding

Suggested color roles

primary

The rich #ad4925 offers a strong, inviting primary color, excellent for main sections, headers, or prominent branding elements.

secondary

The brighter #d66945 provides a lively secondary option, ideal for subheadings, interactive buttons, or to add a touch of warmth and vibrancy.

accent

The deepest #4a1e0b can be used for impactful accents, offering a grounding contrast for important details or call-to-action buttons.

background

The lightest shade, #ff8f6a, can serve as a warm, energetic background, particularly effective when aiming for a playful or bright aesthetic. For a calmer background, pair with a near-white.

text

For optimal readability, use a dark color like #4a1e0b or a deep charcoal (#333333) for text on lighter backgrounds like #ff8f6a. White text works well on darker shades like #4a1e0b or #7d3215.

Accessibility notes

  • Ensure sufficient contrast when using #d66945 with #ff8f6a for text; they may be too close in luminosity.
  • Pair the darkest color, #4a1e0b, with light text (e.g., white or #ff8f6a) for maximum readability.
  • Avoid placing #ad4925 text on an #7d3215 background without careful contrast checking.
  • For body text, a dark brown like #4a1e0b on a light background (like a light cream or white) will offer best legibility.

Recommended combinations

Spicy Warmth

Create vibrant gradients or warm, inviting sections, perfect for highlighting seasonal content.

#FF8F6A · #D66945 · #AD4925

Earthy Depth

Use the deep browns for grounding elements and the bright orange for highlights or calls to action.

#4A1E0B · #7D3215 · #FF8F6A

Autumn Glow

Ideal for textural backgrounds, borders, or to add a harmonious, natural feel to illustrations.

#7D3215 · #AD4925 · #D66945

CSS variables

:root {
  --cinnamon-bark-spice-2-1: #4a1e0b;
  --cinnamon-bark-spice-2-2: #7d3215;
  --cinnamon-bark-spice-2-3: #ad4925;
  --cinnamon-bark-spice-2-4: #d66945;
  --cinnamon-bark-spice-2-5: #ff8f6a;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cinnamon-bark-spice-2": {
        1: "#4a1e0b",
        2: "#7d3215",
        3: "#ad4925",
        4: "#d66945",
        5: "#ff8f6a",
      }
    }
  }
}

Related searches

warm autumn color palettespice tone color schemesearthy orange brownsnatural fall colorscinnamon inspired designs

Palette colors

Hex values

Color 1#4a1e0b
·
Color 2#7d3215
·
Color 3#ad4925
·
Color 4#d66945
·
Color 5#ff8f6a
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
4:1AA18
6.3:1AA
2
1.6:1Fail
1.6:1Fail
2.6:1Fail
4:1AA18
3
2.5:1Fail
1.6:1Fail
1.6:1Fail
2.5:1Fail
4
4:1AA18
2.6:1Fail
1.6:1Fail
1.6:1Fail
5
6.3:1AA
4:1AA18
2.5:1Fail
1.6:1Fail

Similar palettes

More like Cinnamon Bark Spice

View all warm