Back to palettes

Palette

Terra Cotta Sky

A warm, inviting palette merging the earthy tones of sun-baked terracotta with the tranquil blues of a clear sky.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#D9886D#E5A38D#F0C4B8#4D5E6A#2C3C4B

Palette guide

How to use Terra Cotta Sky

Overview

The Terra Cotta Sky palette beautifully merges the comforting warmth of sun-baked earth with the serene tranquility of a clear blue sky. This unique blend features inviting terracotta shades like #D9886D, #E5A38D, and the gentle #F0C4B8, perfectly contrasted by the deep, calming blues of #4D5E6A and #2C3C4B. It’s an exceptional choice for designs that seek balance, blending rustic charm with a modern, fresh sensibility. The palette evokes a sense of calm, natural beauty, and sophistication, making it incredibly versatile for both digital and print applications. This harmonious combination ensures a distinctive and memorable aesthetic.

Best used for

  • Modern rustic home decor brands
  • Sustainable fashion or lifestyle blogs
  • Spa and wellness center branding
  • Travel agencies (Mediterranean, desert themes)
  • Websites promoting balance and tranquility
  • Unique wedding invitations with a natural touch

Suggested color roles

primary

Use #D9886D for main headings or key design elements, providing a warm and inviting anchor.

secondary

Apply #4D5E6A for supporting content or background accents, introducing a cool, sophisticated contrast.

accent

Employ #2C3C4B for impactful calls-to-action or important details, offering deep, grounding emphasis.

background

Utilize #F0C4B8 for light, airy backgrounds, creating a soft, expansive canvas that allows other colors to shine.

text

For body text, #2C3C4B ensures excellent readability on lighter backgrounds, grounding the design with its profound depth.

Accessibility notes

  • Ensure #2C3C4B text has strong contrast against #F0C4B8 backgrounds for optimal readability.
  • Avoid using #D9886D on #E5A38D for small text due to potential low contrast.
  • Lighter shades like #F0C4B8 are best reserved for backgrounds or large decorative elements.
  • Prioritize darker hues like #4D5E6A and #2C3C4B for critical information to meet accessibility standards.

Recommended combinations

Earth & Sky

A balanced blend of warm earth and cool sky, ideal for creating a harmonious and sophisticated look.

#D9886D · #4D5E6A · #F0C4B8

Deep Horizon

Focuses on the grounding blues and vibrant terracotta, excellent for conveying depth and natural contrast.

#2C3C4B · #D9886D · #E5A38D

Soft Breeze

A lighter, more ethereal combination, suitable for designs requiring a gentle, airy, and inviting feel.

#F0C4B8 · #E5A38D · #4D5E6A

CSS variables

:root {
  --terra-cotta-sky-1: #D9886D;
  --terra-cotta-sky-2: #E5A38D;
  --terra-cotta-sky-3: #F0C4B8;
  --terra-cotta-sky-4: #4D5E6A;
  --terra-cotta-sky-5: #2C3C4B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "terra-cotta-sky": {
        1: "#D9886D",
        2: "#E5A38D",
        3: "#F0C4B8",
        4: "#4D5E6A",
        5: "#2C3C4B",
      }
    }
  }
}

Related searches

terracotta blue paletteearthy cool tonesmodern rustic color schemenatural warm cool balancedesert sky colors

Palette colors

Hex values

Color 1#D9886D
·
Color 2#E5A38D
·
Color 3#F0C4B8
·
Color 4#4D5E6A
·
Color 5#2C3C4B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.5:1Fail
4.1:1AA18
2
1.3:1Fail
1.3:1Fail
3.2:1AA18
5.4:1AA
3
1.7:1Fail
1.3:1Fail
4.3:1AA18
7.2:1AAA
4
2.5:1Fail
3.2:1AA18
4.3:1AA18
1.7:1Fail
5
4.1:1AA18
5.4:1AA
7.2:1AAA
1.7:1Fail

Similar palettes

More like Terra Cotta Sky

View all earth