Amber

#FFBF00

What color is Amber?

Amber is a warm, golden-yellow color with a slight orange tint, hex #FFBF00, close to the color of raw honey. It is richer and darker than lemon yellow, with a depth that comes from its orange undertone.

What is the meaning of the color Amber?

Ancient trade routes carried fossilized tree resin — called amber — from the Baltic coast to Mediterranean markets as early as 3000 BCE, and the color takes its name from that material. The warm golden tone became associated with rarity and preservation, since insects and plant matter were often found sealed within the resin. In traffic signals, amber was standardized as the cautionary middle light by the International Commission on Illumination in the early 20th century, giving the color a durable global role. The British Standards Institution formally defines amber in its color standards for road signage, anchoring the hue in public infrastructure worldwide.

RGB
255, 191, 0
HSL
45°, 100%, 50%
CMYK
0, 25, 100, 0
HSV
45°, 100%, 100%
Amber color

What colors go with Amber?

Colors that pair well with Amber include:
Deep brown: grounded, earthy warmth
Forest green: rich natural contrast
Navy blue: cool, bold balance
Cream: soft, warm harmony
Burgundy: deep, dramatic depth

Similar Colors

Conversions & Codes

Format Value CSS
HEX #FFBF00 color: #FFBF00;
RGB 255, 191, 0 color: rgb(255, 191, 0);
RGB Percentage 100%, 75%, 0% color: rgb(100%, 75%, 0%);
CMYK 0%, 25%, 100%, 0% Not supported in CSS
HSL 45°, 100%, 50% color: hsl(45, 100%, 50%);
HSV 45°, 100%, 100% Not supported in CSS
CIE-LAB 40, 13, 64 color: lab(40% 13 64);
Decimal 16760576 Not supported in CSS

Color Variations

Shades

#FFBF00
#E6AC00
#CC9900
#B38600
#997300
#806000
#664D00
#4D3900

Tints

#FFECB3
#FFE699
#FFDF80
#FFD966
#FFD24D
#FFCC33
#FFC61A
#FFBF00

Tones

#FFBF00
#F2B90D
#E6B31A
#D9AC26
#CCA633
#BF9F40
#B3994D
#A69359

Hues

#FFBF00
#80FF00
#00FF40
#00FFFF
#0040FF
#8000FF
#FF00BF
#FF0000

Color Harmonies

Analogous

#FF4000
Click to copy
#FFBF00
Click to copy
100%
#BFFF00
Click to copy

Complementary

#FFBF00
Click to copy
100%
#0040FF
Click to copy

Split Complementary

#FFBF00
Click to copy
100%
#00BFFF
Click to copy
#4000FF
Click to copy

Triadic

#FFBF00
Click to copy
100%
#00FFBF
Click to copy
#BF00FF
Click to copy

Tetradic

#FFBF00
Click to copy
100%
#00FF40
Click to copy
#0040FF
Click to copy
#FF00BF
Click to copy

Square

#FFBF00
Click to copy
100%
#00FF40
Click to copy
#0040FF
Click to copy
#FF00BF
Click to copy

CSS & Dev Snippets

CSS
.amber {
  color: #FFBF00;
}
SCSS
$amber: #FFBF00;
RGB
rgb(255, 191, 0)

Accessibility & Contrast

White background

1.65:1
1.65
contrast ratio on a white background
Element
AA
AAA
Small text
Large text
UI element

Black background

12.70:1
12.70
contrast ratio on a black background
Element
AA
AAA
Small text
Large text
UI element

Popular Tags