Palette

Moroccan Spice Market

A rich tapestry of warm reds, oranges, and golds, reflecting the lively atmosphere of an old spice market.

warmenergetic5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Moroccan Spice Market 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 Moroccan Spice Market.

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

Data visualization

#8B0000#FF8C00#FFD700#DAA520#A52A2A

Palette guide

How to use Moroccan Spice Market

Overview

The "Moroccan Spice Market" palette is a rich and vibrant tapestry of deep reds, radiant oranges, and brilliant golds, capturing the lively atmosphere of an old-world bazaar. It features the intense #8B0000 (dark red) and the warm, inviting #A52A2A (indian red), providing a powerful, earthy foundation. The bright #FF8C00 (dark orange) and the luminous #FFD700 (gold) inject bursts of energy and luxury, complemented by the slightly softer #DAA520 (goldenrod). This palette is ideal for designers looking to create visuals that are both historically rich and energetically vibrant, evoking warmth, tradition, and exotic allure.

Best used for

Cultural institutions and museum exhibitions
Luxury travel and hospitality branding
Historical fiction book covers or layouts
High-end jewelry or artisan product showcases
Themed event decor and invitations
UI/UX for applications with a rich, traditional aesthetic

Suggested color roles

primary

#8B0000 serves as a powerful, deep anchor, ideal for main headings, impactful branding, or dominant design elements.

secondary

#FF8C00 provides a vibrant, energetic support, perfect for subheadings, prominent call-to-action buttons, or graphical highlights.

accent

#FFD700 delivers a brilliant, luxurious pop, drawing attention to interactive elements, awards, or decorative details.

background

#DAA520 can offer a warm, golden base for sections, while a near-white or light cream ensures overall readability.

text

Use #8B0000 or #A52A2A for body text on light backgrounds, ensuring strong contrast and a sophisticated feel.

Accessibility notes

Ensure #FFD700 and #DAA520 have sufficient contrast when used for text against lighter backgrounds.
#8B0000 and #A52A2A provide excellent readability for text on white or very light cream backgrounds.
Avoid using #FF8C00 directly on #8B0000 for text due to potential low contrast, especially for small fonts.
Consider using a darker text color like #8B0000 for small text on any of the lighter gold or orange tones.

Recommended combinations

Royal Gold

Creates a luxurious and powerful statement, ideal for high-impact branding or feature sections.

#8B0000 · #FFD700 · #FF8C00

Earthy Glow

Offers a grounded and inviting feel, suitable for content blocks, navigation, or natural product displays.

#A52A2A · #DAA520 · #FF8C00

Bright Heritage

Uses bright gold as a dominant color with deep reds for strong visual hierarchy and traditional accents.

#FFD700 · #8B0000 · #DAA520

CSS variables

:root {
  --moroccan-spice-market-4-1: #8B0000;
  --moroccan-spice-market-4-2: #FF8C00;
  --moroccan-spice-market-4-3: #FFD700;
  --moroccan-spice-market-4-4: #DAA520;
  --moroccan-spice-market-4-5: #A52A2A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "moroccan-spice-market-4": {
        1: "#8B0000",
        2: "#FF8C00",
        3: "#FFD700",
        4: "#DAA520",
        5: "#A52A2A",
      }
    }
  }
}

Hex values

Color 1#8B0000

Color 2#FF8C00

Color 3#FFD700

Color 4#DAA520

Color 5#A52A2A

Accessibility

Contrast checker

4.3:1AA18

7.1:1AAA

4.5:1AA18

1.4:1Fail

4.3:1AA18

1.7:1Fail

1:1Fail

3:1AA18

7.1:1AAA

1.7:1Fail

1.6:1Fail

5.1:1AA

4.5:1AA18

1:1Fail

1.6:1Fail

3.2:1AA18

1.4:1Fail

3:1AA18

5.1:1AA

3.2:1AA18

Similar palettes

More like Moroccan Spice Market

Moroccan Spice Bazaar

Moroccan Spice Route