Back to palettes

Palette

Golden Hour Haze

Soft, diffused golden hues capturing the magical, tranquil light of the sun just before it dips below the horizon.

warmcalm5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Golden Hour Haze 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 Golden Hour Haze.

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

Data visualization

#DAA520#B8860B#F0E68C#FAFAD2#FFE4B5

Palette guide

How to use Golden Hour Haze

Overview

The Golden Hour Haze palette captures the magical, tranquil light of the sun just before it dips below the horizon, offering a soft, diffused golden aesthetic. This collection, featuring the rich gold of #DAA520, the sunny glow of #F0E68C, and the ethereal cream of #FAFAD2, is perfect for evoking calm and understated luxury. Designers can leverage these warm, mellow tones to create inviting user interfaces, elegant branding, or serene digital art. The deeper #B8860B provides excellent contrast, while the gentle #FFE4B5 offers a subtle touch, making this palette versatile for projects requiring a sophisticated yet comforting feel. It’s ideal for conveying warmth without overwhelming vibrancy.

Best used for

  • Luxury branding and packaging
  • Spa and wellness websites
  • Photography preset filters
  • Serene home decor inspiration
  • Elegant wedding stationery
  • Artistic digital illustrations

Suggested color roles

primary

Use #DAA520 as a sophisticated main brand color, perfect for logos or key calls to action.

secondary

Apply #B8860B for supporting elements, subheadings, or borders to add depth and grounding.

accent

Highlight with #F0E68C for interactive elements, small icons, or gentle background textures.

background

Utilize #FAFAD2 as a light, airy canvas for main content areas, offering a clean yet warm base.

text

Pair with a dark brown or charcoal text color for optimal readability on lighter backgrounds like #FAFAD2 and #FFE4B5. For dark backgrounds, consider white.

Accessibility notes

  • Ensure sufficient contrast when using #F0E68C for text on #FAFAD2; it might require a darker alternative.
  • White text on #DAA520 or #B8860B provides good contrast and legibility.
  • Use a dark text color (e.g., black or very dark brown) on #FFE4B5 and #FAFAD2 for body copy.
  • Avoid pairing #F0E68C with #FFE4B5 for critical text, as contrast may be too low for accessibility.

Recommended combinations

Elegant Base

Ideal for sophisticated website hero sections or print layouts, combining rich gold with a soft cream.

#DAA520 · #FAFAD2 · #B8860B

Soft Glow

Perfect for subtle gradients, background patterns, or delicate illustrative elements, evoking diffused sunlight.

#F0E68C · #FFE4B5 · #FAFAD2

Warm Contrast

Effective for creating inviting UI components like buttons or cards where depth and readability are key.

#B8860B · #DAA520 · #FFE4B5

CSS variables

:root {
  --golden-hour-haze-3-1: #DAA520;
  --golden-hour-haze-3-2: #B8860B;
  --golden-hour-haze-3-3: #F0E68C;
  --golden-hour-haze-3-4: #FAFAD2;
  --golden-hour-haze-3-5: #FFE4B5;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "golden-hour-haze-3": {
        1: "#DAA520",
        2: "#B8860B",
        3: "#F0E68C",
        4: "#FAFAD2",
        5: "#FFE4B5",
      }
    }
  }
}

Related searches

golden hour color schemewarm yellow paletteluxury gold colorssunset inspired huessoft mellow palette

Palette colors

Hex values

Color 1#DAA520
·
Color 2#B8860B
·
Color 3#F0E68C
·
Color 4#FAFAD2
·
Color 5#FFE4B5
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
1.7:1Fail
2.1:1Fail
1.8:1Fail
2
1.5:1Fail
2.5:1Fail
3:1AA18
2.6:1Fail
3
1.7:1Fail
2.5:1Fail
1.2:1Fail
1:1Fail
4
2.1:1Fail
3:1AA18
1.2:1Fail
1.2:1Fail
5
1.8:1Fail
2.6:1Fail
1:1Fail
1.2:1Fail

Similar palettes

More like Golden Hour Haze

View all warm