Back to palettes

Palette

Moroccan Tile Charm

Rich, earthy browns and blues evoke the intricate patterns and sun-baked beauty of traditional Moroccan tiles.

warmelegant5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Moroccan Tile Charm 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 Tile Charm.

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

Data visualization

#8B4513#CD853F#D2691E#4682B4#B0C4DE

Palette guide

How to use Moroccan Tile Charm

Overview

The Moroccan Tile Charm palette evokes the intricate patterns and sun-baked beauty of traditional Moroccan tiles. It features rich #8B4513, a warm #CD853F, a vibrant #D2691E, a serene #4682B4, and a soft #B0C4DE. This collection creates an elegant and inviting mood, perfect for designs that aim to convey cultural richness, intricate detail, and grounded sophistication. Designers and developers can leverage these earthy browns and calming blues to craft visually harmonious interfaces, authentic branding, or engaging digital experiences.

Best used for

  • Interior design and home decor e-commerce
  • Art and craft websites featuring global designs
  • Travel agencies promoting cultural immersion
  • Ethnic restaurant branding and menus
  • Textile and pattern design projects
  • Websites or apps with a focus on heritage and craftsmanship

Suggested color roles

primary

Use #D2691E as a vibrant primary color for headlines or key interactive elements, offering warmth and energy.

secondary

Employ #CD853F for complementary sections, subheadings, or backgrounds, adding a gentle, inviting tone.

accent

Reserve #4682B4 for calming accents, important links, or to introduce a sophisticated cool contrast.

background

The soft #B0C4DE provides a light, airy background. For a richer, inviting background, use #CD853F.

text

A deep brown like #8B4513 provides excellent contrast for text on lighter backgrounds. White text works well on #8B4513 and #4682B4.

Accessibility notes

  • Ensure sufficient contrast for text on #CD853F and #D2691E; dark text is crucial for readability.
  • Avoid using #B0C4DE for critical text on #4682B4 as their contrast might be insufficient for WCAG AA.
  • Utilize #8B4513 for primary text on light backgrounds to meet accessibility standards effectively.
  • When pairing the browns and blues, ensure distinct value differences for visual hierarchy and colorblind users.

Recommended combinations

Earthy Warmth

Ideal for warm gradients, background textures, or content blocks that need to feel grounded and inviting.

#CD853F · #D2691E · #8B4513

Tile Contrast

Perfect for high-contrast headers, call-to-action buttons, or sections where a blend of warm and cool is desired.

#B0C4DE · #4682B4 · #D2691E

Global Harmony

Excellent for highlighting key features, navigation items, or creating data visualizations with a balanced, sophisticated feel.

#8B4513 · #4682B4 · #CD853F

CSS variables

:root {
  --moroccan-tile-charm-1: #8B4513;
  --moroccan-tile-charm-2: #CD853F;
  --moroccan-tile-charm-3: #D2691E;
  --moroccan-tile-charm-4: #4682B4;
  --moroccan-tile-charm-5: #B0C4DE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "moroccan-tile-charm": {
        1: "#8B4513",
        2: "#CD853F",
        3: "#D2691E",
        4: "#4682B4",
        5: "#B0C4DE",
      }
    }
  }
}

Related searches

moroccan tile color paletteearthy blue brown schemerich intricate designglobal inspired colorselegant tile hues

Palette colors

Hex values

Color 1#8B4513
·
Color 2#CD853F
·
Color 3#D2691E
·
Color 4#4682B4
·
Color 5#B0C4DE
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.4:1Fail
2:1Fail
1.7:1Fail
4:1AA18
2
2.4:1Fail
1.2:1Fail
1.4:1Fail
1.7:1Fail
3
2:1Fail
1.2:1Fail
1.1:1Fail
2:1Fail
4
1.7:1Fail
1.4:1Fail
1.1:1Fail
2.3:1Fail
5
4:1AA18
1.7:1Fail
2:1Fail
2.3:1Fail

Similar palettes

More like Moroccan Tile Charm

View all warm
Moroccan Mosaic Hues
Aged Leather Patina
Amber Glaze
Amber Whiskey Swirl
Ancient Egypt Gold
Ancient Egyptian Gold