Back to palettes

Palette

Golden Hour Field

Bathed in the radiant glow of the golden hour, these warm yellows illuminate an endless field.

warmnatural5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FFBF00#FFD700#FDFD96#FFE75C#E8C430

Palette guide

How to use Golden Hour Field

Overview

The Golden Hour Field palette captures the sublime warmth and natural radiance of late afternoon sunlight. This collection of rich, inviting yellows, ranging from the deep gold of #FFBF00 to the gentle glow of #FDFD96, offers designers a versatile foundation for projects seeking to evoke joy, comfort, and natural beauty. With hues like the vibrant #FFD700 and the mellow #FFE75C, this palette is ideal for creating designs that feel optimistic and organic. Developers can leverage the distinct hex codes to build interfaces that convey warmth and accessibility, ensuring a cohesive and sunny user experience. The slightly muted #E8C430 adds a grounded touch.

Best used for

  • Natural and organic product branding
  • Summer event promotions and marketing
  • Children's book illustrations and educational content
  • Photography portfolios focusing on landscapes
  • Cozy interior design inspiration websites
  • Food and beverage packaging, especially for honey or citrus

Suggested color roles

primary

Use #FFBF00 as a strong, welcoming brand color for logos, main headings, or key calls to action, conveying richness and positivity.

secondary

Employ #FFE75C for supporting elements like subheadings, secondary buttons, or data visualizations, maintaining the warm glow.

accent

Apply #E8C430 sparingly for subtle highlights, interactive states, or small decorative details, providing a grounded contrast.

background

Utilize #FDFD96 as a light, airy base for content areas, offering a soft warmth without overwhelming readability.

text

Against these bright yellows, a very dark charcoal or black provides optimal contrast for body text, ensuring maximum readability and accessibility.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using lighter yellows like #FDFD96.
  • For interactive elements, use a darker yellow from the palette, such as #FFBF00, to ensure visibility against lighter backgrounds.
  • Avoid using light yellow text on light yellow backgrounds; always pair with a significantly darker color for readability.
  • Test color combinations with accessibility tools to meet WCAG guidelines, particularly for text on graphic elements.

Recommended combinations

Sunny Core

Ideal for main branding elements, calls to action, and headers that demand attention and convey vibrancy.

#FFBF00 · #FFD700 · #FFE75C

Soft Glow

Best for background gradients, subtle UI elements, or secondary content areas where a gentle warmth is desired.

#FDFD96 · #FFE75C · #E8C430

Rich Earth

Excellent for natural product packaging, decorative accents, or illustrations needing a grounded yet luminous feel.

#E8C430 · #FFBF00 · #FDFD96

CSS variables

:root {
  --golden-hour-field-1: #FFBF00;
  --golden-hour-field-2: #FFD700;
  --golden-hour-field-3: #FDFD96;
  --golden-hour-field-4: #FFE75C;
  --golden-hour-field-5: #E8C430;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "golden-hour-field": {
        1: "#FFBF00",
        2: "#FFD700",
        3: "#FDFD96",
        4: "#FFE75C",
        5: "#E8C430",
      }
    }
  }
}

Related searches

warm yellow color schemegolden hour color palettesunny design colorsnatural gold tonesoptimistic yellow branding

Palette colors

Hex values

Color 1#FFBF00
·
Color 2#FFD700
·
Color 3#FDFD96
·
Color 4#FFE75C
·
Color 5#E8C430
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.5:1Fail
1.3:1Fail
1:1Fail
2
1.2:1Fail
1.3:1Fail
1.1:1Fail
1.2:1Fail
3
1.5:1Fail
1.3:1Fail
1.2:1Fail
1.6:1Fail
4
1.3:1Fail
1.1:1Fail
1.2:1Fail
1.4:1Fail
5
1:1Fail
1.2:1Fail
1.6:1Fail
1.4:1Fail

Similar palettes

More like Golden Hour Field

View all warm