Back to palettes

Palette

Terra Cotta Bloom

A grounding palette inspired by ancient clay, desert blooms, and weathered architecture.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Terra Cotta Bloom 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 Terra Cotta Bloom.

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

Data visualization

#CD5C5C#D2B48C#E9967A#B0C4DE#A9A9A9

Palette guide

How to use Terra Cotta Bloom

Overview

The Terra Cotta Bloom palette offers a unique and grounding blend, inspired by ancient clay, desert blooms, and weathered architecture. Featuring the classic #CD5C5C terracotta, it introduces unexpected yet harmonious elements like the soft blue-gray #B0C4DE and the neutral #A9A9A9. This collection is ideal for designers and developers seeking a palette that is both earthy and subtly refined. The warm #E9967A and sandy #D2B48C provide natural warmth, while the cool tones add a sophisticated balance, allowing for versatile applications that feel both authentic and modern.

Best used for

  • Architectural or historical preservation websites
  • Desert-inspired fashion or interior design
  • Branding for artisanal goods with a modern twist
  • Cultural institution digital platforms
  • E-commerce for unique, handcrafted items
  • User interfaces needing a blend of warm and cool neutrals

Suggested color roles

primary

Use #CD5C5C for main calls to action, providing a strong, inviting terracotta focal point.

secondary

Apply #E9967A for supporting elements or secondary buttons, offering a softer, peachy warmth.

accent

Reserve #B0C4DE for subtle accents, backgrounds, or to introduce a calming, cool contrast.

background

Employ #D2B48C for a warm, sandy base, or #A9A9A9 for a neutral, grounding backdrop.

text

A deep charcoal or black works well on #D2B48C and #E9967A; white text is effective on #CD5C5C and #B0C4DE.

Accessibility notes

  • #D2B48C and #E9967A are lighter; ensure dark text (e.g., black or #CD5C5C) is used for readability.
  • Check contrast when pairing #B0C4DE with other light colors, as it can lack sufficient contrast with white text.
  • Ensure interactive elements have clear visual states, especially given the range of warm and cool tones.
  • For body text, a strong contrasting color like a dark gray or black is recommended on lighter backgrounds.

Recommended combinations

Desert Balance

A harmonious blend of warm terracotta, cool blue-gray, and sandy beige for a sophisticated look.

#CD5C5C · #B0C4DE · #D2B48C

Rustic Modern

Neutral gray as a base, with soft peach and strong terracotta for modern, earthy designs.

#A9A9A9 · #E9967A · #CD5C5C

Ancient Earth

Sandy background with cool blue accents and a vibrant terracotta highlight for a unique aesthetic.

#D2B48C · #B0C4DE · #CD5C5C

CSS variables

:root {
  --terra-cotta-bloom-1: #CD5C5C;
  --terra-cotta-bloom-2: #D2B48C;
  --terra-cotta-bloom-3: #E9967A;
  --terra-cotta-bloom-4: #B0C4DE;
  --terra-cotta-bloom-5: #A9A9A9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "terra-cotta-bloom": {
        1: "#CD5C5C",
        2: "#D2B48C",
        3: "#E9967A",
        4: "#B0C4DE",
        5: "#A9A9A9",
      }
    }
  }
}

Related searches

terracotta blue gray paletteearthy modern color schemedesert bloom UI colorswarm cool neutral paletteweathered architecture colors

Palette colors

Hex values

Color 1#CD5C5C
·
Color 2#D2B48C
·
Color 3#E9967A
·
Color 4#B0C4DE
·
Color 5#A9A9A9
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
1.7:1Fail
2.2:1Fail
1.7:1Fail
2
2:1Fail
1.2:1Fail
1.1:1Fail
1.2:1Fail
3
1.7:1Fail
1.2:1Fail
1.3:1Fail
1:1Fail
4
2.2:1Fail
1.1:1Fail
1.3:1Fail
1.3:1Fail
5
1.7:1Fail
1.2:1Fail
1:1Fail
1.3:1Fail

Similar palettes

More like Terra Cotta Bloom

View all earth
Desert Clay Warmth
Desert Haze Horizon
Sunbaked Earthenware
Sunstone Mesa Horizon
Terracotta Bloom Garden
Adobe Desert Hues