Back to palettes

Palette

Sun-Kissed Ochre

A radiant palette showcasing the sunny warmth and rich pigment of natural ochre stones under a clear sky.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sun-Kissed Ochre 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 Sun-Kissed Ochre.

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

Data visualization

#B8860B#CD853F#D2B48C#DAA520#FFD700

Palette guide

How to use Sun-Kissed Ochre

Overview

The Sun-Kissed Ochre palette is a radiant and earthy collection inspired by natural ochre stones under a clear sky, offering a rich blend of warm yellows and browns. It features a deep gold (#B8860B), a burnt orange (#CD853F), a soft tan (#D2B48C), a vibrant goldenrod (#DAA520), and a bright, pure gold (#FFD700). This palette is perfect for conveying authenticity, warmth, and a touch of rustic elegance. Designers can use these hues to create grounded yet luminous designs, suitable for a wide array of applications from artisanal branding to natural product lines.

Best used for

  • Artisanal craft and pottery brands
  • Natural beauty and wellness products
  • Rustic and bohemian interior design
  • Autumnal marketing and event themes
  • Earthy website and app interfaces
  • Cultural and heritage-focused projects

Suggested color roles

primary

Utilize #DAA520 as a strong primary for branding, headings, or key calls to action, symbolizing warmth and energy.

secondary

Apply #CD853F for supporting elements, subheadings, or background textures, adding a rich, earthy depth.

accent

Introduce #FFD700 as a bright accent for highlights, icons, or small decorative details, providing a luminous pop.

background

Employ #D2B48C as a soft, natural background color, offering a calming and readable foundation.

text

For body text, use a dark brown, black, or deep charcoal to ensure excellent contrast against the lighter ochre shades.

Accessibility notes

  • Ensure sufficient contrast for text on #D2B48C and #FFD700; dark text is crucial for readability.
  • Be cautious with pairing #B8860B and #CD853F for text and background if the contrast ratio is low.
  • The bright #FFD700 should be used with dark text or as a highlight to prevent eye strain.
  • Consider larger font sizes for text used with #DAA520 to enhance legibility.

Recommended combinations

Ochre Radiance

Ideal for creating a bright, welcoming header or banner, highlighting key information with a golden glow.

#FFD700 · #DAA520 · #D2B48C

Earthy Depth

Excellent for grounding sections, providing a sense of stability and natural richness in layouts.

#B8860B · #CD853F · #D2B48C

Golden Sunset

Perfect for energetic accents or visual storytelling, capturing the warmth of a setting sun.

#DAA520 · #CD853F · #FFD700

CSS variables

:root {
  --sun-kissed-ochre-1: #B8860B;
  --sun-kissed-ochre-2: #CD853F;
  --sun-kissed-ochre-3: #D2B48C;
  --sun-kissed-ochre-4: #DAA520;
  --sun-kissed-ochre-5: #FFD700;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sun-kissed-ochre": {
        1: "#B8860B",
        2: "#CD853F",
        3: "#D2B48C",
        4: "#DAA520",
        5: "#FFD700",
      }
    }
  }
}

Related searches

ochre color schemenatural gold palettewarm earthy yellowsun-drenched terracottarustic autumn hues

Palette colors

Hex values

Color 1#B8860B
·
Color 2#CD853F
·
Color 3#D2B48C
·
Color 4#DAA520
·
Color 5#FFD700
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.7:1Fail
1.5:1Fail
2.3:1Fail
2
1.1:1Fail
1.5:1Fail
1.3:1Fail
2.1:1Fail
3
1.7:1Fail
1.5:1Fail
1.1:1Fail
1.4:1Fail
4
1.5:1Fail
1.3:1Fail
1.1:1Fail
1.6:1Fail
5
2.3:1Fail
2.1:1Fail
1.4:1Fail
1.6:1Fail

Similar palettes

More like Sun-Kissed Ochre

View all earth
Agave Bloom Dawn
Golden Dune Embrace
Golden Dunes
Golden Earth Sands
Tuscan Olive Grove
Adobe Sunset