Palette

Island Sunset Hues

A vibrant blend mirroring the stunning and serene spectacle of a tropical island sunset, from bright gold to soft pink.

warmnatural5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Island Sunset Hues 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 Island Sunset Hues.

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

Data visualization

#FEF3BD#FEE184#FEBD69#FE936F#EE6C7E

Palette guide

How to use Island Sunset Hues

Overview

The "Island Sunset Hues" palette beautifully captures the serene yet vibrant spectacle of a tropical twilight, transitioning from soft golden light to a warm, rosy glow. It features delicate tones like #FEF3BD (Pale Yellow) and #FEE184 (Light Gold), gradually deepening into the inviting orange of #FEBD69 and the richer coral of #FE936F. The palette culminates in the soft, romantic pink of #EE6C7E (Coral Pink). This collection is ideal for designers and developers seeking to create calming, sophisticated, and naturally beautiful experiences, perfect for elegant branding, gentle user interfaces, or designs that evoke warmth and tranquility.

Best used for

Spa and wellness brand websites
Romantic wedding invitations
Natural beauty product packaging
Photography portfolio showcasing
Interior design mood boards
Soft, feminine e-commerce sites

Suggested color roles

primary

#FEF3BD (A soft, illuminating base, ideal for backgrounds, main content areas, or gentle branding.)

secondary

#FEBD69 (A warm, inviting tone for secondary headings, cards, or subtle accent panels.)

accent

#EE6C7E (A soft, romantic pink for delicate highlights, interactive elements, or feminine branding touches.)

background

#FEF3BD (Creates a light, airy, and warm canvas. Alternatively, a clean white for crisp contrast.)

text

Dark charcoal or black for optimal readability on lighter shades. For darker elements, a very light gray or white.

Accessibility notes

All light colors (#FEF3BD, #FEE184, #FEBD69) require dark text (e.g., black or dark charcoal) for WCAG AA compliance.
Avoid using lighter palette colors for text on similarly light backgrounds due to poor contrast.
Ensure that #FE936F and #EE6C7E have sufficient contrast when used for interactive elements against lighter backgrounds.
Use caution with color-coding, as the subtle differences between some shades may be difficult for some users to distinguish.

Recommended combinations

Soft Horizon

Creates a gentle, fading gradient effect, perfect for backgrounds or serene visual elements.

#FEF3BD · #FEE184 · #FEBD69

Rosy Glow

Ideal for conveying warmth, romance, and a feminine touch in branding or illustrations.

#FE936F · #EE6C7E · #FEBD69

Subtle Depth

A balanced combination for creating visual interest with a soft contrast, suitable for cards or sections.

#EE6C7E · #FEF3BD · #FE936F

CSS variables

:root {
  --island-sunset-hues-1: #FEF3BD;
  --island-sunset-hues-2: #FEE184;
  --island-sunset-hues-3: #FEBD69;
  --island-sunset-hues-4: #FE936F;
  --island-sunset-hues-5: #EE6C7E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "island-sunset-hues": {
        1: "#FEF3BD",
        2: "#FEE184",
        3: "#FEBD69",
        4: "#FE936F",
        5: "#EE6C7E",
      }
    }
  }
}

Hex values

Color 1#FEF3BD

Color 2#FEE184

Color 3#FEBD69

Color 4#FE936F

Color 5#EE6C7E

Accessibility

Contrast checker

1.2:1Fail

1.5:1Fail

2:1Fail

2.7:1Fail

1.2:1Fail

1.3:1Fail

1.7:1Fail

2.3:1Fail

1.5:1Fail

1.3:1Fail

1.8:1Fail

2:1Fail

1.7:1Fail

1.3:1Fail

1.4:1Fail

2.7:1Fail

2.3:1Fail

1.8:1Fail

1.4:1Fail

Similar palettes

More like Island Sunset Hues

Island Sunset Hues

See it in context.

Ready when you are.

Built with Island Sunset Hues.

How to use Island Sunset Hues

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Soft Horizon

Rosy Glow

Subtle Depth

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Island Sunset Hues