Maroon Colors  ·  Color Library

Palettes / Colors / #FBC56E

#FBC56E — Light Vivid Orange

#FBC56E is a orange color we call Light Vivid Orange, closest to the named color SandyBrown (#F4A460). It belongs to the orange family.

Color name

Closest CSS keyword: sandybrown (#F4A460) — not an exact match. CSS sandybrown gives you #F4A460, a different color; use #FBC56E 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.

#FBC56E is a warm orange color associated with warmth, appetite and friendliness. 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 #6FA5FB; it also sits naturally between #FB7F6F and #EBFB6F. In the palettes below you can see it working alongside real color combinations from our collection.

#FBC56E · RGB 251, 197, 110

Download PNG swatch SVG

Color values

HEX#FBC56E
RGB251, 197, 110
HSL37°, 95%, 71%
HSV37°, 56%, 98%
CMYK0%, 22%, 56%, 2%
XYZ62.56, 61.57, 23.34
Yxy61.57, 0.4243, 0.4175
CIE-Lab82.68, 9.59, 50.45
Hunter Lab78.46, 9.35, 34.29

RGB & CMYK percentages

Red 98% · Green 77% · Blue 43%

Cyan 0% · Magenta 22% · Yellow 56% · Key 2%

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

Previews

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

CSS code for #FBC56E

.text { color: #FBC56E; }
.background { background-color: #FBC56E; }
.border { border: 3px solid #FBC56E; }
.text-rgb { color: rgb(251, 197, 110); }
.text-hsl { color: hsl(37, 95%, 71%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #FBC56E; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(251, 197, 110, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #FBC56E; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(251, 197, 110, 0.8); }

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

Shades of #FBC56E

#FAB84C#FAAC2E#F99E0B#DB8906#BD7605#9A6104#774B03#553502#372201#140C01

Tints of #FBC56E

#FCCB7E#FCCF88#FCD597#FDD9A1#FDDFAF#FDE3B9#FEE9C8#FEEDD2#FEF3E1#FEF7EB

Tones of #FBC56E

#F1C379#E7C183#DDBE8D#D3BC97#C9BAA1#BFB7AB

Color harmonies

Complementary — #6FA5FB:

Analogous:

Triadic:

Contrast & accessibility

Against white text1.58:1 Fails
Against black text13.31:1 AAA

Best text color on #FBC56E: #000000.

Semi-transparent (opacity) text on #FBC56E

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 #FBC56E: ·

How #FBC56E looks with color blindness

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

Protanopia · #E4E383Deuteranopia · #E7EB88Tritanopia · #F89497

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 Yellow 500 · #FFEB3BMaterial Lime 500 · #CDDC39Material Amber 500 · #FFC107

Palettes with a similar color

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

Palette Ffc570
#FFC570 · #EFD2B0 · #547792 · #1A3263
Palette 4793af
#4793AF · #FFC470 · #DD5746 · #8B322C
Palette 884a39
#884A39 · #C38154 · #FFC26F · #F9E0BB
Palette Ffa62f
#FFA62F · #FFC96F · #FFE8C8 · #ACD793
Palette 124076
#124076 · #7F9F80 · #F9E897 · #FFC374
Palette Aa530e
#AA530E · #DF8931 · #F5C16C · #F3EDED

Similar colors

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

#FFC570#FFC470#FFC26F#FFC96F#FFC374#F5C16C#FFCC70#F7C566#F2C46A#FFBD73#F1C36D#F6CE71

Browse neighbouring colors

← #FBC56D  ·  #FBC56F →

Frequently asked questions

What color is #FBC56E?

#FBC56E is Light Vivid Orange, a orange color (RGB 251, 197, 110). Its closest standard named color is SandyBrown.

What is the RGB and HSL of #FBC56E?

#FBC56E is RGB 251, 197, 110 — HSL 37°, 95%, 71% — CMYK 0%, 22%, 56%, 2%.

What colors go with #FBC56E?

Its complement is #6FA5FB; analogous partners are #FB7F6F and #EBFB6F. It also appears in 6+ palettes in our collection.

Can I use #FBC56E for text?

Black text on #FBC56E has a contrast ratio of 13.31:1 (passes WCAG AA); white text gives 1.58:1.