Back to palettes

Palette

Spiced Moroccan Bazaar

A sensory blend of warm, inviting oranges and browns, like a bustling marketplace in Morocco.

warmenergetic5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Spiced Moroccan Bazaar 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 Spiced Moroccan Bazaar.

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

Data visualization

#8B4513#D2691E#F4A460#FFDAB9#CD853F

Palette guide

How to use Spiced Moroccan Bazaar

Overview

The Spiced Moroccan Bazaar palette is a sensory blend of warm, inviting oranges and browns, evoking the atmosphere of a bustling marketplace in Morocco. It features the deep saddle brown #8B4513, the rich chocolate orange #D2691E, and the earthy peru #CD853F. Complementing these are the soft sandy brown #F4A460 and the airy peach puff #FFDAB9. This palette is designed to convey exoticism, warmth, and an energetic cultural richness. Its harmonious blend of deep and light tones offers versatility, making it perfect for designs that aim to transport viewers to a vibrant, sun-drenched destination while maintaining a welcoming and authentic feel.

Best used for

  • Travel and tourism websites and brochures
  • Ethnic restaurant and culinary branding
  • Home decor inspired by global markets
  • Textile and fashion design collections
  • Cultural festival and event promotions
  • Documentary film graphics and storytelling

Suggested color roles

primary

#D2691E (Rich chocolate orange, providing a strong, inviting, and exotic brand presence)

secondary

#CD853F (Earthy peru, a warm and reliable supporting color for various UI elements)

accent

#F4A460 (Soft sandy brown, ideal for subtle highlights, borders, or secondary information)

background

#FFDAB9 (Peach puff, offering a soft, warm, and airy base that brightens the design)

text

#8B4513 (Deep saddle brown, ensuring excellent readability for body text on light backgrounds)

Accessibility notes

  • Use #8B4513 or a dark charcoal for body text on #FFDAB9 for optimal contrast.
  • Ensure sufficient contrast when pairing #D2691E or #CD853F with #FFDAB9 for larger text.
  • Avoid using #F4A460 as text color on #FFDAB9 due to low contrast.
  • Provide clear visual indications for interactive elements, especially with similar warm tones.

Recommended combinations

Bazaar Foundation

Perfect for establishing a readable base with a warm primary accent, ideal for content sections.

#8B4513 · #FFDAB9 · #D2691E

Moroccan Warmth

Use for supporting elements, subtle highlights, or background textures, creating a soft gradient.

#CD853F · #F4A460 · #D2691E

Exotic Depth

Great for headers, dark accents, and balancing the warmth with a clean, light background.

#D2691E · #CD853F · #FFDAB9

CSS variables

:root {
  --spiced-moroccan-bazaar-1: #8B4513;
  --spiced-moroccan-bazaar-2: #D2691E;
  --spiced-moroccan-bazaar-3: #F4A460;
  --spiced-moroccan-bazaar-4: #FFDAB9;
  --spiced-moroccan-bazaar-5: #CD853F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "spiced-moroccan-bazaar": {
        1: "#8B4513",
        2: "#D2691E",
        3: "#F4A460",
        4: "#FFDAB9",
        5: "#CD853F",
      }
    }
  }
}

Related searches

moroccan color schemespiced bazaar palettewarm exotic designearthy orange brown colorscultural travel branding

Palette colors

Hex values

Color 1#8B4513
·
Color 2#D2691E
·
Color 3#F4A460
·
Color 4#FFDAB9
·
Color 5#CD853F
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
3.5:1AA18
5.4:1AA
2.4:1Fail
2
2:1Fail
1.8:1Fail
2.8:1Fail
1.2:1Fail
3
3.5:1AA18
1.8:1Fail
1.5:1Fail
1.5:1Fail
4
5.4:1AA
2.8:1Fail
1.5:1Fail
2.3:1Fail
5
2.4:1Fail
1.2:1Fail
1.5:1Fail
2.3:1Fail

Similar palettes

More like Spiced Moroccan Bazaar

View all warm
Vibrant Bazaar Spice
Ancient Spice Route
Bazaar Spice Bloom
Bazaar Spice Symphony
Desert Spice Kettle
Golden Bazaar Spice