Palette

Spice Bazaar Hues

A lively, aromatic blend of deep reds and rich golds, reminiscent of a bustling spice market.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Spice Bazaar Hues 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 Spice Bazaar Hues.

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

Data visualization

#7F0000#CC5500#FFC400#804000#3B0000

Palette guide

How to use Spice Bazaar Hues

Overview

The Spice Bazaar Hues palette is a vibrant and aromatic blend of deep reds, rich oranges, and luminous golds, evoking the bustling energy of an exotic market. Featuring the profound #7F0000 and the earthy #3B0000, it provides a strong, warm foundation. The palette brightens with the energetic #CC5500 and culminates in the radiant #FFC400, alongside the rich #804000. This collection offers designers and developers a compelling visual language for projects that demand warmth, authenticity, and a touch of the exotic. It's perfectly suited for creating engaging, inviting, and memorable experiences across various digital and print mediums.

Best used for

Food and beverage branding
Cultural event promotions
Autumn seasonal marketing
Restaurant website design
Travel blogs focusing on exotic destinations
Artisanal product packaging

Suggested color roles

primary

Use #7F0000 as a strong, grounding primary color for backgrounds or main sections, conveying richness and depth.

secondary

Employ #CC5500 for secondary elements, call-to-action buttons, or larger text blocks, adding warmth and vibrancy.

accent

Apply #FFC400 sparingly for highlights, icons, or interactive elements, providing a bright, inviting glow.

background

The deep #3B0000 or #7F0000 offers a rich, warm background, while #FFC400 can be used for brighter, energetic sections.

text

For dark backgrounds, #FFC400 provides excellent readability. On lighter backgrounds, a deep charcoal or near-black ensures clarity.

Accessibility notes

Ensure sufficient contrast for text on backgrounds, especially with #CC5500 or #804000.
Avoid using #804000 as text on #7F0000 or #3B0000 due to potential low contrast and readability issues.
The bright #FFC400 may need a dark border or shadow if placed on light imagery to maintain visibility.
For body text, use #3B0000 on #FFC400 for optimal contrast and warmth.

Recommended combinations

Market Glow

Ideal for striking hero images or prominent feature areas, creating a captivating and energetic focal point.

#7F0000 · #FFC400 · #CC5500

Earthy Spice

Excellent for content blocks or product showcases, offering a grounded yet inviting presentation with a bright highlight.

#3B0000 · #804000 · #FFC400

Vibrant Aroma

Perfect for call-to-action buttons or banners, combining vibrancy with a solid base and a radiant accent.

#CC5500 · #7F0000 · #FFC400

CSS variables

:root {
  --spice-bazaar-hues-1: #7F0000;
  --spice-bazaar-hues-2: #CC5500;
  --spice-bazaar-hues-3: #FFC400;
  --spice-bazaar-hues-4: #804000;
  --spice-bazaar-hues-5: #3B0000;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "spice-bazaar-hues": {
        1: "#7F0000",
        2: "#CC5500",
        3: "#FFC400",
        4: "#804000",
        5: "#3B0000",
      }
    }
  }
}

Hex values

Color 1#7F0000

Color 2#CC5500

Color 3#FFC400

Color 4#804000

Color 5#3B0000

Accessibility

Contrast checker

2.6:1Fail

6.9:1AA

1.4:1Fail

1.6:1Fail

2.6:1Fail

2.7:1Fail

1.8:1Fail

4.1:1AA18

6.9:1AA

2.7:1Fail

5:1AA

11.1:1AAA

1.4:1Fail

1.8:1Fail

5:1AA

2.2:1Fail

1.6:1Fail

4.1:1AA18

11.1:1AAA

2.2:1Fail

Similar palettes

More like Spice Bazaar Hues

Vibrant Market Spices

Vibrant Spice Bazaar