Back to palettes

Palette

Citrus Burst

An invigorating splash of zesty oranges, bright yellows, and fresh greens, like sun-ripened fruit.

VibrantEnergetic5 colors
More Vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF4500#FFA500#FFD700#ADFF2F#7FFF00

Palette guide

How to use Citrus Burst

Overview

The Citrus Burst palette is an invigorating collection that perfectly blends the zest of oranges and yellows with the freshness of greens. It features a bold #FF4500 (OrangeRed), a classic #FFA500 (Orange), and a radiant #FFD700 (Gold), beautifully complemented by the lively #ADFF2F (GreenYellow) and #7FFF00 (Chartreuse). This palette offers designers and developers a versatile range of hues for creating energetic and fresh digital experiences. It's ideal for projects that aim to evoke vitality, nature, and a vibrant, healthy aesthetic, making it excellent for dynamic interfaces and engaging branding.

Best used for

  • Health and wellness branding
  • Eco-friendly product packaging
  • Outdoor adventure websites
  • Food and beverage promotions (especially healthy options)
  • Spring/summer marketing campaigns
  • Interactive educational apps

Suggested color roles

primary

#FFD700 (A bright, optimistic gold perfect for main headers, prominent UI elements, or cheerful branding.)

secondary

#FFA500 (A classic orange, ideal for subheadings, secondary calls-to-action, or navigational elements.)

accent

#7FFF00 (A vivid chartreuse that provides a refreshing pop, excellent for highlights, interactive elements, or alerts.)

background

#FFD700 (A warm, inviting base that emanates positivity, suitable for full-page backgrounds or large sections.)

text

#FF4500 (For strong, energetic text on light backgrounds, or use a dark neutral like #333333 for general readability.)

Accessibility notes

  • Ensure sufficient contrast when pairing lighter shades like #FFD700 or #ADFF2F with light text; use #FF4500 or #000000.
  • The vibrant #FF4500 and #FFA500 offer good contrast for white or very light text.
  • Avoid using #ADFF2F or #7FFF00 for small text on complex backgrounds, as readability can be challenging.
  • For interactive elements, maintain at least a 3:1 contrast ratio against adjacent colors to meet WCAG AA standards.

Recommended combinations

Fresh & Bold

Excellent for energetic hero sections, with #FFD700 as background, #7FFF00 for fresh accents, and #FF4500 for key CTAs.

#FFD700 · #7FFF00 · #FF4500

Zesty Layers

Ideal for infographics or layered UI elements, showcasing a natural progression from orange to green.

#FFA500 · #ADFF2F · #FFD700

Nature's Pop

Use #FF4500 for high-impact titles, #7FFF00 for striking illustrations, and #FFA500 for supporting details.

#FF4500 · #7FFF00 · #FFA500

CSS variables

:root {
  --citrus-burst-1: #FF4500;
  --citrus-burst-2: #FFA500;
  --citrus-burst-3: #FFD700;
  --citrus-burst-4: #ADFF2F;
  --citrus-burst-5: #7FFF00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "citrus-burst": {
        1: "#FF4500",
        2: "#FFA500",
        3: "#FFD700",
        4: "#ADFF2F",
        5: "#7FFF00",
      }
    }
  }
}

Related searches

citrus orange green palettefresh vibrant color schemeenergetic fruit colorshealthy brand colorsspring summer ui palette

Palette colors

Hex values

Color 1#FF4500
·
Color 2#FFA500
·
Color 3#FFD700
·
Color 4#ADFF2F
·
Color 5#7FFF00
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.5:1Fail
2.8:1Fail
2.7:1Fail
2
1.7:1Fail
1.4:1Fail
1.6:1Fail
1.5:1Fail
3
2.5:1Fail
1.4:1Fail
1.1:1Fail
1.1:1Fail
4
2.8:1Fail
1.6:1Fail
1.1:1Fail
1.1:1Fail
5
2.7:1Fail
1.5:1Fail
1.1:1Fail
1.1:1Fail

Similar palettes

More like Citrus Burst

View all Vibrant
Energetic Citrus Punch
Lemon Grove Zest
Citrus Zest Burst
Citrus Zest Splash
Coral Bloom
Indian Market Spice