Maroon Colors  ·  Color Library

Palettes / Colors / #FBBD2B

#FBBD2B — Vivid Yellow

#FBBD2B is a yellow color we call Vivid Yellow, closest to the named color GoldenRod (#DAA520). It belongs to the yellow family.

Color name

Closest CSS keyword: goldenrod (#DAA520) — not an exact match. CSS goldenrod gives you #DAA520, a different color; use #FBBD2B when you need this exact shade.

Sources: common names follow widely used color-name references; CSS keywords and their hex values follow the CSS Color specification.

#FBBD2B is a warm yellow color associated with optimism, attention and cheer. It is saturated enough to be the accent — buttons, highlights and calls to action — while neutrals do the quiet work around it.

Its strongest partner is its complement #2D6BFB; it also sits naturally between #FB562D and #D2FB2D. In the palettes below you can see it working alongside real color combinations from our collection.

#FBBD2B · RGB 251, 189, 43

Download PNG swatch SVG

Color values

HEX#FBBD2B
RGB251, 189, 43
HSL42°, 96%, 58%
HSV42°, 83%, 98%
CMYK0%, 25%, 83%, 2%
XYZ58.42, 57.08, 10.22
Yxy57.08, 0.4647, 0.4540
CIE-Lab80.22, 10.35, 75.00
Hunter Lab75.55, 10.00, 42.32

RGB & CMYK percentages

Red 98% · Green 74% · Blue 17%

Cyan 0% · Magenta 25% · Yellow 83% · Key 2%

CMYK values are unprofiled approximations for screen reference — not a print-proofing guarantee.

Previews

Sample text in #FBBD2B on black
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sample text in #FBBD2B on white
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

CSS code for #FBBD2B

.text { color: #FBBD2B; }
.background { background-color: #FBBD2B; }
.border { border: 3px solid #FBBD2B; }
.text-rgb { color: rgb(251, 189, 43); }
.text-hsl { color: hsl(42, 96%, 58%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #FBBD2B; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(251, 189, 43, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #FBBD2B; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(251, 189, 43, 0.8); }

HTML: <p style="color:#FBBD2B">Text here</p> · <div style="background-color:#FBBD2B">Div content here</div>

Shades of #FBBD2B

#FAB514#EBA605#D29404#B47F04#9B6D03#825C03#644702#4B3502#2D2001#140E00

Tints of #FBBD2B

#FBC341#FCCA55#FCCE64#FCD578#FDDB8C#FDE1A0#FDE7B4#FEECC3#FEF2D7#FFF9EB

Tones of #FBBD2B

#ECB73C#DEB14A#CFAB59#C0A568#B19F77#A39A85

Color harmonies

Complementary — #2D6BFB:

Analogous:

Triadic:

Contrast & accessibility

Against white text1.69:1 Fails
Against black text12.42:1 AAA

Best text color on #FBBD2B: #000000.

Semi-transparent (opacity) text on #FBBD2B

Text set with opacity blends into the background, so its real contrast is lower than the solid ratios above. Choose a text color and an opacity to see the blended color and its true ratio:

100%
Sample heading text
Smaller body text shows the effect best.

Blended color: · Contrast against #FBBD2B: ·

How #FBBD2B looks with color blindness

Simulated with standard Machado color-vision-deficiency matrices — useful when this color carries meaning in charts, maps or interfaces:

Protanopia · #E0E04EDeuteranopia · #E4E857Tritanopia · #F86A70

Closest design-system colors

The nearest matches in the Tailwind CSS, Material Design and Bootstrap palettes — handy when you need a framework class instead of a raw hex:

Material Amber 500 · #FFC107Bootstrap warning · #FFC107Tailwind yellow 500 · #EAB308

Palettes with a similar color

These palettes use a close neighbour of #FBBD2B rather than the exact color:

Palette F5f5dc
#F5F5DC · #FBC02D · #FF8F00 · #C62828
Modern Ruby Twilight
#091621 · #FBC42D · #F84C64 · #F99A3F
Palette 3db2ff
#3DB2FF · #FFEDDA · #FFB830 · #FF2442
Golden Ruby Tempest
#260C2F · #F86C25 · #76FE41 · #F9C224
Palette Fff1ca
#FFF1CA · #FFB823 · #708A58 · #2D4F2B
Burning Ruby
#4F7D32 · #FFD16A · #F5B52E · #D9361E

Similar colors

The closest colors that actually appear in our palette collection — click any to open its page:

#FBC02D#FBC42D#FFB830#F9C224#FFB823#F5B52E#FAB532#FFB22C#FAB522#FAB12F#FFB534#FFB433

Browse neighbouring colors

← #FBBD2A  ·  #FBBD2C →

Frequently asked questions

What color is #FBBD2B?

#FBBD2B is Vivid Yellow, a yellow color (RGB 251, 189, 43). Its closest standard named color is GoldenRod.

What is the RGB and HSL of #FBBD2B?

#FBBD2B is RGB 251, 189, 43 — HSL 42°, 96%, 58% — CMYK 0%, 25%, 83%, 2%.

What colors go with #FBBD2B?

Its complement is #2D6BFB; analogous partners are #FB562D and #D2FB2D. It also appears in 6+ palettes in our collection.

Can I use #FBBD2B for text?

Black text on #FBBD2B has a contrast ratio of 12.42:1 (passes WCAG AA); white text gives 1.69:1.