Palette

Sunny Citrus Splash

A burst of sun-kissed yellows and vibrant oranges, invigorating and refreshing like a glass of lemonade.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sunny Citrus Splash 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 Sunny Citrus Splash.

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

Data visualization

#FFD700#FFC700#FFA500#FF8C00#E0BBE4

Palette guide

How to use Sunny Citrus Splash

Overview

The Sunny Citrus Splash palette is an invigorating burst of sun-kissed yellows and vibrant oranges, like a refreshing glass of lemonade. It features a delightful gradient of warm tones, from the bright yellow #FFD700 and #FFC700 to the classic orange #FFA500 and the deep #FF8C00. A surprising yet harmonious addition is the soft lavender #E0BBE4, which introduces a touch of playful sophistication. This palette is perfect for designers seeking to convey energy, warmth, and a hint of unexpected charm. Developers can implement these hex codes for lively UI, cheerful marketing, or any project aiming for a bright, energetic, and memorable visual appeal.

Best used for

Summer beverage branding (lemonade, juice)
Relaxed holiday resort promotions
Creative arts and crafts websites
Children's fashion and toy designs
Personal blog or portfolio sites
Lighthearted social media campaigns

Suggested color roles

primary

Use #FFA500 as a balanced and inviting orange for main interactive elements or brand identity.

secondary

Apply #FFD700 as a bright, sunny yellow for supportive elements or background accents.

accent

Utilize #E0BBE4 as a soft, unique, and contrasting lavender for playful accents or subtle highlights.

background

Employ #E0BBE4 as a soft, tranquil base, ensuring dark text for readability.

text

For text, use dark charcoal or black for readability on #FFD700, #FFC700, and #E0BBE4. White works well on #FFA500 and #FF8C00.

Accessibility notes

#E0BBE4, #FFD700, and #FFC700 have low contrast with white text; use dark text (e.g., black or charcoal) for readability.
Ensure sufficient contrast when using adjacent yellow and orange shades, such as #FFD700 and #FFC700.
#FF8C00 offers good contrast with white text, making it suitable for clear headings or buttons.
Consider text size and weight when placing text over lighter palette colors to enhance readability.

Recommended combinations

Sunset Hues

Warm gradients, inviting hero sections, or natural product packaging.

#FFD700 · #FFA500 · #FF8C00

Playful Twist

Unique branding, whimsical illustrations, or creative UI accents.

#FFC700 · #E0BBE4 · #FFA500

Zesty Contrast

Highlighting key information, distinctive logos, or energetic event graphics.

#FFD700 · #FF8C00 · #E0BBE4

CSS variables

:root {
  --sunny-citrus-splash-2-1: #FFD700;
  --sunny-citrus-splash-2-2: #FFC700;
  --sunny-citrus-splash-2-3: #FFA500;
  --sunny-citrus-splash-2-4: #FF8C00;
  --sunny-citrus-splash-2-5: #E0BBE4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sunny-citrus-splash-2": {
        1: "#FFD700",
        2: "#FFC700",
        3: "#FFA500",
        4: "#FF8C00",
        5: "#E0BBE4",
      }
    }
  }
}

Hex values

Color 1#FFD700

Color 2#FFC700

Color 3#FFA500

Color 4#FF8C00

Color 5#E0BBE4

Accessibility

Contrast checker

1.1:1Fail

1.4:1Fail

1.7:1Fail

1.2:1Fail

1.1:1Fail

1.3:1Fail

1.5:1Fail

1.1:1Fail

1.4:1Fail

1.3:1Fail

1.2:1Fail

1.7:1Fail

1.5:1Fail

1.2:1Fail

1.4:1Fail

1.2:1Fail

1.1:1Fail

1.2:1Fail

1.4:1Fail

Similar palettes

More like Sunny Citrus Splash

Sunny Citrus Splash

See it in context.

Ready when you are.

Built with Sunny Citrus Splash.

How to use Sunny Citrus Splash

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Sunset Hues

Playful Twist

Zesty Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Sunny Citrus Splash