Back to palettes

Palette

Moroccan Souk Bazaar

A rich tapestry of bold, warm colors with exotic accents, reminiscent of a bustling Moroccan market.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#B22222#FF8C00#DAA520#4682B4#800080

Palette guide

How to use Moroccan Souk Bazaar

Overview

The Moroccan Souk Bazaar palette is a vibrant tapestry of bold, warm colors with exotic accents, reminiscent of a bustling Moroccan market. It features striking #B22222 (FireBrick), energetic #FF8C00 (DarkOrange), and golden #DAA520 (Goldenrod), complemented by unexpected cool tones like #4682B4 (SteelBlue) and #800080 (Purple). Designers and developers can use this palette to create dynamic, engaging, and culturally rich digital experiences. Its high contrast and diverse range of hues offer immense versatility for expressive branding and interfaces that capture attention and evoke an adventurous spirit.

Best used for

  • Festival and event promotion websites
  • Creative marketing campaigns and advertising
  • Artistic and cultural tourism platforms
  • Children's entertainment or educational apps
  • Vibrant e-commerce sites for unique goods
  • Bold and expressive branding projects

Suggested color roles

primary

Use #FF8C00 (DarkOrange) as an energetic, inviting primary color for main calls to action and prominent headings.

secondary

Apply #DAA520 (Goldenrod) for secondary information, subheadings, or background elements, offering a warm complement.

accent

Employ #4682B4 (SteelBlue) or #800080 (Purple) sparingly for striking accents, icons, or to create a dramatic contrast.

background

Utilize #B22222 (FireBrick) for bold backgrounds or impactful sections, demanding attention and pairing well with light text.

text

For primary body text, a dark charcoal or black is best. Use white or a very pale grey on #B22222, #4682B4, and #800080 for readability.

Accessibility notes

  • High contrast is crucial for this palette. Ensure sufficient contrast for all text, especially on vibrant backgrounds.
  • Avoid using #DAA520 on #FF8C00 for small text or interactive elements due to low contrast.
  • Text on #B22222, #4682B4, and #800080 will almost always require white or very light text to meet WCAG standards.
  • Carefully test combinations involving #4682B4 and #800080 with other colors for visual clarity, especially for color-blind users.

Recommended combinations

Market Spice

Ideal for bold headers, feature sections, or marketing materials that need to convey warmth and energy.

#B22222 · #FF8C00 · #DAA520

Exotic Contrast

Excellent for creating dynamic calls to action, distinguishing interactive elements, or artistic illustrations.

#FF8C00 · #4682B4 · #800080

Bazaar Energy

Perfect for balancing strong warm tones with a cool accent, suitable for vibrant and engaging UI components.

#B22222 · #DAA520 · #4682B4

CSS variables

:root {
  --moroccan-souk-bazaar-1: #B22222;
  --moroccan-souk-bazaar-2: #FF8C00;
  --moroccan-souk-bazaar-3: #DAA520;
  --moroccan-souk-bazaar-4: #4682B4;
  --moroccan-souk-bazaar-5: #800080;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "moroccan-souk-bazaar": {
        1: "#B22222",
        2: "#FF8C00",
        3: "#DAA520",
        4: "#4682B4",
        5: "#800080",
      }
    }
  }
}

Related searches

vibrant market colorsexotic souk palettebold color scheme designmoroccan cultural brandinghigh contrast web palette

Palette colors

Hex values

Color 1#B22222
·
Color 2#FF8C00
·
Color 3#DAA520
·
Color 4#4682B4
·
Color 5#800080
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.9:1Fail
3:1Fail
1.6:1Fail
1.4:1Fail
2
2.9:1Fail
1:1Fail
1.8:1Fail
4:1AA18
3
3:1Fail
1:1Fail
1.8:1Fail
4.2:1AA18
4
1.6:1Fail
1.8:1Fail
1.8:1Fail
2.3:1Fail
5
1.4:1Fail
4:1AA18
4.2:1AA18
2.3:1Fail

Similar palettes

More like Moroccan Souk Bazaar

View all vibrant