Palette

Amber Spice Blend

A fragrant array of warm reds, oranges, and deep browns, capturing the sensory richness of an exotic spice market.

warmenergetic5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Amber Spice Blend 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 Amber Spice Blend.

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

Data visualization

#800000#A52A2A#D35400#F39C12#7B3F00

Palette guide

How to use Amber Spice Blend

Overview

The "Amber Spice Blend" palette is a fragrant array of warm reds, oranges, and deep browns, capturing the sensory richness of an exotic spice market. It features a robust #800000 (Maroon) and #A52A2A (Brown-Red) for depth, contrasted with the vibrant #D35400 (Pumpkin Orange) and #F39C12 (Orange Gold) for energetic highlights. The grounding #7B3F00 (Dark Brown) ties the palette together with an earthy sophistication. This palette is ideal for designs that aim to convey warmth, vibrancy, and a touch of exotic flair, perfect for food branding, cultural events, or dynamic digital interfaces.

Best used for

Food and spice brand packaging
Restaurant or culinary website themes
Cultural event marketing and decor
E-commerce for artisanal or global goods
Autumnal and holiday season promotions
Dynamic web interfaces requiring a warm, energetic feel

Suggested color roles

primary

Use #D35400 as a bold, energetic pumpkin orange, excellent for main headings, calls-to-action, or a vibrant brand identity.

secondary

Employ #A52A2A as a rich, warm brown-red, perfect for subheadings, prominent content blocks, or a sophisticated accent.

accent

Apply #F39C12 as a bright, luminous orange-gold, ideal for subtle highlights, interactive elements, or a pop of warmth.

background

A light cream or off-white (e.g., #FDF8ED) to allow the rich, vibrant colors to truly shine and ensure readability.

text

For primary body text on light backgrounds, use #800000, a deep, strong maroon that offers excellent contrast and strong emphasis.

Accessibility notes

Ensure #800000 text has excellent contrast against light backgrounds (e.g., #FDF8ED).
Avoid using #F39C12 or #D35400 for small text on light backgrounds due to insufficient contrast.
When using #A52A2A for text, pair it with a very light background for optimal readability.
The intensity of these colors means careful contrast checking is essential, especially for interactive elements.

Recommended combinations

Market Spice

A deep base, a vibrant primary, and a luminous accent, perfect for creating dynamic visual hierarchies.

#800000 · #D35400 · #F39C12

Earthy Blend

A grounding brown with rich red and orange, suitable for layered content or visual storytelling.

#7B3F00 · #A52A2A · #D35400

Golden Infusion

A bright accent with strong warm colors, ideal for highlighting key information or energetic banners.

#F39C12 · #D35400 · #800000

CSS variables

:root {
  --amber-spice-blend-1: #800000;
  --amber-spice-blend-2: #A52A2A;
  --amber-spice-blend-3: #D35400;
  --amber-spice-blend-4: #F39C12;
  --amber-spice-blend-5: #7B3F00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "amber-spice-blend": {
        1: "#800000",
        2: "#A52A2A",
        3: "#D35400",
        4: "#F39C12",
        5: "#7B3F00",
      }
    }
  }
}

Hex values

Color 1#800000

Color 2#A52A2A

Color 3#D35400

Color 4#F39C12

Color 5#7B3F00

Accessibility

Contrast checker

1.5:1Fail

2.6:1Fail

5:1AA

1.3:1Fail

1.5:1Fail

1.7:1Fail

3.2:1AA18

1.2:1Fail

2.6:1Fail

1.7:1Fail

1.9:1Fail

2:1Fail

5:1AA

3.2:1AA18

1.9:1Fail

3.8:1AA18

1.3:1Fail

1.2:1Fail

2:1Fail

3.8:1AA18

Similar palettes

More like Amber Spice Blend

View all warm

Ancient Spice Route

Moroccan Spice Market

Spiced Bazaar Market

Bazaar Spice Bloom

Bohemian Bazaar Spice

Desert Spice Kettle