#F0DC82

What color is Buff?

Buff is a soft, warm yellow with a slightly sandy or creamy tone, hex #F0DC82, close to the color of unbleached linen. It is lighter and dustier than golden yellow, with enough warmth to keep it from looking pale.

What is the meaning of the color Buff?

The name traces to buff leather, made from the hides of buffalo or ox, which became a standard material for military coats in Europe by the 17th century. English and Dutch soldiers wore buff coats widely during the Thirty Years’ War, and the color became associated with the natural, undyed hide those garments displayed. The Continental Army adopted buff as one of its facing colors alongside blue, a pairing formalized in the uniform regulations of 1779. The buff and blue combination remains visible today in the dress uniforms of the United States Army.

RGB
240, 220, 130
HSL
49°, 79%, 73%
CMYK
0, 8, 46, 6
HSV
49°, 46%, 94%
Buff color

What colors go with Buff?

Colors that pair well with Buff include:
Navy Blue: crisp, classic contrast
Terracotta: warm earthy depth
Sage Green: soft, muted balance
Chocolate Brown: grounded, natural pairing
Ivory: gentle tonal harmony

Similar Colors

Conversions & Codes

Format Value CSS
HEX #F0DC82 color: #F0DC82;
RGB 240, 220, 130 color: rgb(240, 220, 130);
RGB Percentage 94%, 86%, 51% color: rgb(94%, 86%, 51%);
CMYK 0%, 8%, 46%, 6% Not supported in CSS
HSL 49°, 79%, 73% color: hsl(49, 79%, 73%);
HSV 49°, 46%, 94% Not supported in CSS
CIE-LAB 58, 4, 30 color: lab(58% 4 30);
Decimal 15785090 Not supported in CSS

Color Variations

Shades

#F1DD84
#EDD362
#E9CA41
#E5C120
#C8A817
#A78C14
#857010
#64540C

Tints

#FBF5DA
#F9F1CE
#F8EEC1
#F6EAB5
#F5E7A9
#F3E39C
#F2E090
#F1DD84

Tones

#F1DD84
#EBD989
#E6D68F
#E0D294
#DBCF9A
#D5CB9F
#D0C8A4
#CAC4AA

Hues

#F1DD84
#B3F184
#84F1A6
#84E9F1
#8498F1
#C184F1
#F184CE
#F18B84

Color Harmonies

Analogous

#F1A684
Click to copy
96%
#F0DC82
Click to copy
100%
#CEF184
Click to copy

Complementary

#F0DC82
Click to copy
100%
#8498F1
Click to copy

Split Complementary

#F0DC82
Click to copy
100%
#84CEF1
Click to copy
#A684F1
Click to copy

Triadic

#F0DC82
Click to copy
100%
#84F1DD
Click to copy
#DD84F1
Click to copy

Tetradic

#F0DC82
Click to copy
100%
#84F1A6
Click to copy
#8498F1
Click to copy
#F184CE
Click to copy

Square

#F0DC82
Click to copy
100%
#84F1A6
Click to copy
#8498F1
Click to copy
#F184CE
Click to copy

CSS & Dev Snippets

CSS
.buff {
  color: #F0DC82;
}
SCSS
$buff: #F0DC82;
RGB
rgb(240, 220, 130)

Accessibility & Contrast

White background

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

Black background

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

Popular Tags