Color code

#FFBA00

Selective Yellow

What is Selective Yellow (#FFBA00)?

Selective Yellow sits in the warm orange family, with the hex code #FFBA00 mapping to rgb(255, 186, 0) in RGB and hsl(43.8, 100%, 50%) in HSL. In OKLCH it carries 83% perceptual lightness and 0.171 chroma — a highly saturated, light reading that behaves well as a background, surface or supporting tone in modern interfaces. Orange combines red's urgency with yellow's optimism, landing on a hue that feels friendly without losing energy. It is the colour of recommendations, "+1" social signals and sunsets — inviting rather than aggressive.

Quick facts

Family: orange
Tone: light
Intensity: vivid
Luminance: 0.5638
Best text: #0B0B10

Color psychology & common uses

Where selective yellow works

secondary CTAs and upsell badges
highlight strokes on illustrations
price tags and promo ribbons
category icons for active or social features
warm dark-mode accents

Watch out

Pure orange rarely passes WCAG AA against white at body sizes — reserve it for headings, icons or buttons with explicit ≥4.5:1 fallback text colour.

Industries

DTC consumer brands
food and lifestyle
travel and hospitality
creative tooling
community platforms

Pairs nicely with

ink navy #0c1828
warm white #fff7ec
olive #4a4a23
teal #186465

All formats

HEX#FFBA00
RGBrgb(255, 186, 0)
HSLhsl(43.8, 100%, 50%)
HSVhsv(43.8, 100%, 100%)
LCHlch(80.43% 83.81 78.23)
OKLCHoklch(83.09% 0.1714 81.55)
LABlab(80.43% 17.09 82.05)

CSS

:root {
  --color: #ffba00;
  --color-rgb: rgb(255, 186, 0);
  --color-hsl: hsl(43.8, 100%, 50%);
  --color-oklch: oklch(83.09% 0.1714 81.55);
}

Similar colors

Contrast pairs

How selective yellow performs as foreground text on common surfaces, scored with WCAG 2.1.

Selective Yellow

on White

1.71:1Fail

Selective Yellow

on Black

12.28:1AAAAA

Selective Yellow

on Soft gray

1.57:1Fail

Selective Yellow

on Near black

11.48:1AAAAA

complementary

#FFBA00

Selective Yellow

#0045FF

Neon Blue

analogous

#FF3A00

Orange Red

#FFBA00

Selective Yellow

#C5FF00

Green Yellow

triadic

#FFBA00

Selective Yellow

#00FFBA

Aquamarine

#BA00FF

Electric Purple

tetradic

#FFBA00

Selective Yellow

#00FF3A

Lime

#0045FF

Neon Blue

#FF00C4

Deep Pink

Tints of Selective Yellow

Tints are produced by mixing selective yellow with progressively more white.

#FFC62B

Sunglow

#FFD155

Sunglow

#FFDD80

Dandelion

#FFE8AA

Eggshell

#FFF4D5

Cosmic Latte

Shades of Selective Yellow

Shades are produced by mixing selective yellow with progressively more black.

#D59B00

Goldenrod

#AA7C00

Dark Goldenrod

#805D00

Sand Dune

#553E00

Cafe Noir

#2A1F00

Cafe Noir

Tones of Selective Yellow

Tones are produced by mixing selective yellow with progressively more gray, lowering chroma while keeping lightness.

#EAB015

Buttercup

#D5A72A

Goldenrod

#BF9D40

Goldenrod

#AA9355

Dark Goldenrod

#95896A

Dark Goldenrod

Where to use Selective Yellow

As a page background or surface in minimalist layouts.
Paired with the harmonies above for balanced palettes.
Combined with one of the 6 closest named colors for subtle variation in component states.
Tested for accessibility before shipping to production - try our contrast checker or a11y fixer.

Frequently asked questions

What color is #FFBA00?

#FFBA00 is Selective Yellow, a colour in the warm orange family. In RGB it is rgb(255, 186, 0), in HSL hsl(43.8, 100%, 50%) and in OKLCH oklch(83.09% 0.1714 81.55). Orange combines red's urgency with yellow's optimism, landing on a hue that feels friendly without losing energy. It is the colour of recommendations, "+1" social signals and sunsets — inviting rather than aggressive.

What does the color Selective Yellow mean?

Orange combines red's urgency with yellow's optimism, landing on a hue that feels friendly without losing energy. It is the colour of recommendations, "+1" social signals and sunsets — inviting rather than aggressive. Industries that rely on this hue family include DTC consumer brands, food and lifestyle, travel and hospitality, creative tooling — they choose it precisely because of those associations.

What are good colors to pair with Selective Yellow (#FFBA00)?

Selective Yellow pairs well with ink navy #0c1828, warm white #fff7ec, olive #4a4a23, teal #186465. For palette work, the complementary, analogous, triadic and tetradic harmonies generated below give you mathematically balanced starting points — copy any swatch and drop it straight into your design tool.

Where should I use Selective Yellow in a design?

Common uses include secondary CTAs and upsell badges, highlight strokes on illustrations, price tags and promo ribbons, category icons for active or social features and similar surfaces. Pure orange rarely passes WCAG AA against white at body sizes — reserve it for headings, icons or buttons with explicit ≥4.5:1 fallback text colour.

What is Selective Yellow (#FFBA00)?

Color psychology & common uses

Where selective yellow works

secondary CTAs and upsell badges

highlight strokes on illustrations

price tags and promo ribbons

category icons for active or social features

warm dark-mode accents

Watch out

Pure orange rarely passes WCAG AA against white at body sizes — reserve it for headings, icons or buttons with explicit ≥4.5:1 fallback text colour.

Frequently asked questions

What color is #FFBA00?

What does the color Selective Yellow mean?

What are good colors to pair with Selective Yellow (#FFBA00)?

Where should I use Selective Yellow in a design?