Back to palettes

Palette

Terra Cotta Bloom

Warm and grounding, capturing the rustic beauty of sun-drenched terracotta and natural flora in full bloom.

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

#C85C3A#E27E58#F5A885#A07D6C#7D4D3E

Palette guide

How to use Terra Cotta Bloom

Overview

This Terra Cotta Bloom palette is a celebration of warm, grounding hues, perfectly capturing the rustic beauty of sun-drenched terracotta and natural flora. With a range from the deep #7D4D3E to the soft #F5A885, and anchored by the inviting #C85C3A, it offers a sophisticated yet approachable aesthetic. Designers and developers will find this palette excellent for creating serene, organic, and highly textural interfaces. The inclusion of #A07D6C adds a unique, muted clay tone that complements the vibrant oranges, allowing for rich visual depth and a sense of timeless elegance in any digital product.

Best used for

  • Sustainable brand websites or packaging
  • Home goods and interior design portfolios
  • Nature-inspired mobile app interfaces
  • Editorial content with an organic feel
  • Wellness and mindfulness platforms
  • Photography portfolios showcasing natural landscapes

Suggested color roles

primary

Use #C85C3A for main interactive elements, providing a strong, warm and inviting focal point.

secondary

Apply #E27E58 for supporting information or secondary buttons, a lighter, more approachable orange.

accent

Reserve #F5A885 for subtle highlights, background textures, or decorative details, offering a soft, airy touch.

background

Employ #A07D6C for a unique, muted background that evokes natural clay, or a very light cream for content.

text

A deep brown like #7D4D3E is excellent for body text on lighter backgrounds; white text works on #C85C3A and #7D4D3E.

Accessibility notes

  • #F5A885 requires dark text (e.g., #7D4D3E or black) to ensure adequate contrast for readability.
  • Be mindful of contrast between #E27E58 and #A07D6C if used together, as their lightness values are somewhat close.
  • For any text on #A07D6C, a darker contrasting color like #7D4D3E is crucial for accessibility.
  • Ensure interactive elements using lighter shades have sufficient contrast with surrounding content.

Recommended combinations

Natural Depth

Creates a sophisticated visual hierarchy, with the darkest for structure and lightest for highlights.

#7D4D3E · #C85C3A · #F5A885

Rustic Warmth

Ideal for content blocks, where the muted clay provides a soft background and oranges add warmth.

#E27E58 · #A07D6C · #C85C3A

Gentle Bloom

A soft gradient for headers, blending light orange into a deeper, grounding brown.

#F5A885 · #E27E58 · #7D4D3E

CSS variables

:root {
  --terra-cotta-bloom-5-1: #C85C3A;
  --terra-cotta-bloom-5-2: #E27E58;
  --terra-cotta-bloom-5-3: #F5A885;
  --terra-cotta-bloom-5-4: #A07D6C;
  --terra-cotta-bloom-5-5: #7D4D3E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "terra-cotta-bloom-5": {
        1: "#C85C3A",
        2: "#E27E58",
        3: "#F5A885",
        4: "#A07D6C",
        5: "#7D4D3E",
      }
    }
  }
}

Related searches

earthy rustic color schemenatural terracotta palettewarm clay hex codesorganic UI design colorsmuted orange brown palette

Palette colors

Hex values

Color 1#C85C3A
·
Color 2#E27E58
·
Color 3#F5A885
·
Color 4#A07D6C
·
Color 5#7D4D3E
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.1:1Fail
1.1:1Fail
1.7:1Fail
2
1.5:1Fail
1.5:1Fail
1.3:1Fail
2.5:1Fail
3
2.1:1Fail
1.5:1Fail
1.9:1Fail
3.6:1AA18
4
1.1:1Fail
1.3:1Fail
1.9:1Fail
1.9:1Fail
5
1.7:1Fail
2.5:1Fail
3.6:1AA18
1.9:1Fail

Similar palettes

More like Terra Cotta Bloom

View all earth
Artisan Pottery Wheel
Adobe Sunset
Artisan Clay Vessel
Artisan Clay Vessel
Desert Bloom Clay
Desert Clay Pot