Back to palettes

Palette

Mediterranean Clay Tile

Warm reds and oranges capture the essence of sun-baked Mediterranean terracotta tiles, evoking rustic charm.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mediterranean Clay Tile 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 Mediterranean Clay Tile.

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

Data visualization

#B22222#A0522D#D2691E#F4A460#FFDEAD

Palette guide

How to use Mediterranean Clay Tile

Overview

The Mediterranean Clay Tile palette captures the rustic charm of sun-baked terracotta, with its rich array of warm reds and oranges. This earthy collection features the deep #B22222 (firebrick) and #A0522D (sienna), transitioning beautifully to the vibrant #D2691E (chocolate) and the softer #F4A460 (sandy brown). The light #FFDEAD (navajo white) provides a creamy, neutral base, allowing the warmer tones to truly shine. Designers and developers can leverage this palette to create designs that feel grounded, traditional, and inviting, perfect for evoking a natural and authentic mood. It’s ideal for projects aiming for a cozy, handcrafted aesthetic.

Best used for

  • Interior design (especially kitchens and bathrooms)
  • Traditional restaurant or cafe branding
  • Ceramics and pottery brands
  • Gardening and outdoor living product websites
  • Historical or heritage-themed projects
  • Rustic and artisanal e-commerce platforms

Suggested color roles

primary

Designate #B22222 as the strong primary for important calls-to-action, main headings, or elements that need to convey solidity and warmth.

secondary

Utilize #A0522D for supporting information, subheadings, or background sections, providing a rich, earthy complement.

accent

Introduce #D2691E sparingly for highlights, interactive elements, or decorative details to add a vibrant, inviting pop.

background

Employ #FFDEAD as a soft, creamy background, offering a light, natural canvas that enhances the warmth of the other colors.

text

For optimal readability, #B22222 provides a strong contrast on #FFDEAD for body text, or use a very dark brown (#3A2A1E) for maximum legibility.

Accessibility notes

  • Ensure sufficient contrast for text on #FFDEAD; #B22222 works well, but lighter colors may not.
  • Avoid using #F4A460 for small text on light backgrounds due to potential low contrast.
  • The contrast between #D2691E and #FFDEAD is generally good for headings, but verify for body text.
  • Consider larger font sizes or bolding for text in mid-tone colors like #A0522D to enhance readability.

Recommended combinations

Tile Floor

Ideal for content areas, with #FFDEAD as background, #B22222 for main titles, and #A0522D for body text or secondary headings.

#FFDEAD · #B22222 · #A0522D

Warm Earth

Apply #F4A460 for card backgrounds, #D2691E for interactive buttons, and #A0522D for borders or accent lines.

#F4A460 · #D2691E · #A0522D

Rustic Depth

Use #FFDEAD as a clean canvas, #B22222 for prominent calls-to-action, and #A0522D for navigation items or important links.

#FFDEAD · #B22222 · #A0522D

CSS variables

:root {
  --mediterranean-clay-tile-1: #B22222;
  --mediterranean-clay-tile-2: #A0522D;
  --mediterranean-clay-tile-3: #D2691E;
  --mediterranean-clay-tile-4: #F4A460;
  --mediterranean-clay-tile-5: #FFDEAD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mediterranean-clay-tile": {
        1: "#B22222",
        2: "#A0522D",
        3: "#D2691E",
        4: "#F4A460",
        5: "#FFDEAD",
      }
    }
  }
}

Related searches

terracotta tile colorsmediterranean warm paletterustic orange red schemeclay inspired design colorsearthy interior color palette

Palette colors

Hex values

Color 1#B22222
·
Color 2#A0522D
·
Color 3#D2691E
·
Color 4#F4A460
·
Color 5#FFDEAD
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.8:1Fail
3.3:1AA18
5.2:1AA
2
1.2:1Fail
1.5:1Fail
2.8:1Fail
4.4:1AA18
3
1.8:1Fail
1.5:1Fail
1.8:1Fail
2.8:1Fail
4
3.3:1AA18
2.8:1Fail
1.8:1Fail
1.6:1Fail
5
5.2:1AA
4.4:1AA18
2.8:1Fail
1.6:1Fail

Similar palettes

More like Mediterranean Clay Tile

View all earth
Mediterranean Clay Harvest
Mediterranean Terra cotta
Rustic Tuscan Clay
Sunbaked Terracotta Dream
Aegean Village
Ancient Clay Pottery