Skip to content
ColorPlum

Colors · value from the xkcd color survey (2010)

Copper color: hex code #B66325, RGB and palettes

Copper is #B66325 (RGB 182, 99, 37), the xkcd survey value: a medium-dark orange-brown. Black text on it measures 4.80:1, white is just under the AA line at 4.37:1, so use dark lettering.

By Paul Gunder. Every value is computed from published standards; see how ColorPlum works.

Updated

ColorPlum swatchCoppermedium-dark, saturated orange
HEX
#B66325
RGB
rgb(182, 99, 37)
HSL
hsl(26, 66%, 43%)

Best text on it: black at 4.80:1

Copy codes as
Build a paletteMake a gradientCheck contrastWallpaper

Every code for Copper

  • HEX#B66325
  • RGBrgb(182, 99, 37)
  • HSLhsl(26, 66%, 43%)
  • HSV26°, 80%, 71%
  • CMYK0%, 46%, 80%, 29%
  • Lablab(51.2% 31 48.3)
  • OKLCHoklch(58.6% 0.129 53.1)
  • Decimal11952933

Tints, shades and tones

From white to black in 10% steps, with Copper in the middle. Tap a code to copy it.

  1. 90%#F8EFE9
  2. 80%#F0E0D3
  3. 70%#E9D0BE
  4. 60%#E2C1A8
  5. 50%#DBB192
  6. 40%#D3A17C
  7. 30%#CC9266
  8. 20%#C58251
  9. 10%#BD733B
  10. Base#B66325
  11. 10%#A45921
  12. 20%#924F1E
  13. 30%#7F451A
  14. 40%#6D3B16
  15. 50%#5B3213
  16. 60%#49280F
  17. 70%#371E0B
  18. 80%#241407
  19. 90%#120A04

Tones (mixed with gray)

  1. 10%#B1662E
  2. 20%#AB6937
  3. 30%#A66C40
  4. 40%#A06F49
  5. 50%#9B7253
  6. 60%#96745C
  7. 70%#907765
  8. 80%#8B7A6E
  9. 90%#857D77

Matching colors

Complementary
Analogous
Triadic
Split complementary
Tetradic (square)
Monochromatic
  • #371E0B
  • #764018
  • #B66325
  • #DB894D
  • #E8B38C

Copper in 3D color space

OKLab, the space ColorPlum does its math in: lightness runs up the pole, hue goes around it and saturation grows outward. The faint shell is every color a screen can show (saturation is drawn wider than lightness so hues separate). Drag to turn it.

Copper with its complement, its triad and its tint and shade
  • Copper
  • Triad #25B663
  • Triad #6325B6
  • Complement
  • 50% tint
  • 50% shade

Copper in use

New collectionAutumn edit

Card body text stays dark for reading; copper carries the header and the button.

Shop nowTag

Headline in Copper

A paragraph with a link in dark text, because this color is too light for text on white; use it for fills instead.

How it looks with color-vision deficiency

A simulation (Machado and colleagues, 2009) of how the color and its complement read without one type of cone.

  • Typical color vision#B66325
  • Protanopia (no red cones)#7B6D1C
  • Deuteranopia (no green cones)#8F8024
  • Tritanopia (no blue cones)#C85156

Contrast and readability

PairingRatioWCAG 2.2
as text on white4.37:1AA AA large AAA
as text on black4.80:1AA AA large AAA
white text on it4.37:1AA AA large AAA
black text on it4.80:1AA AA large AAA
on your background3.81:1AA AA large AAA

Export

:root {
  --copper: #b66325;
  --copper-rgb: 182 99 37;
  --copper-on: #000000;
}
On this page

Copper is the metal in pipes, pans and old pennies, and its color is a reddish orange that darkens with age. Screens can only suggest it, but there is a common reference. The CSS list has no copper, so the page shows #B66325 from the xkcd survey, the color people typed when they were asked to name what they saw.

Breaking down the value

The RGB numbers are 182, 99, 37: lots of red, about half as much green, and a little blue. In HSL that is hue 26°, 66% saturation and 43% lightness, an orange pulled toward brown. CMYK reads 0%, 46%, 80%, 29%, and the decimal version is 11952933. A shiny metal in real life changes with light and angle, while this swatch is flat, so photographs of copper will not match it exactly.

It has a crowd of neighbors in the survey: "orangish brown" (#B25F03) and "orangey brown" (#B16002) are only about 2 away in OKLab, and "umber" (#B26400) is also 2.0. In the CSS list the closest are chocolate (#D2691E) at 5.5, sienna (#A0522D) at 6.4 and indianred at 8.0. Copper is lighter and more orange than sienna, and more subdued than chocolate.

Contrast and pairings

  • Black text: 4.80:1, a pass for normal text at AA.
  • White text: 4.37:1, which just misses 4.5:1. Large headings can use it, but body copy should not.
  • Copper on white: also 4.37:1, so it works for large type and graphics more than paragraphs. For a darker text version, the 30% shade #7F451A on the pale #F8EFE9 measures 6.68:1.
  • Complement: a calm steel blue, #2578B6, which sets off copper well. The analogous colors are #B62530 and #B6AB25.

The tints run softly from #BD733B to #F8EFE9, and the shades from #A45921 down to #120A04, so a whole earthy set comes from one hue.

Worked example

Imagine you are making a menu board for a small coffee shop that wants a roasted, handmade feel. You choose a dark espresso brown, #241407, for the background and put the drink names in the cream tint #F8EFE9. For prices and section lines you use copper itself. Copper on that dark brown measures 4.07:1, which is fine for larger price numbers but not for the small description lines, so those stay cream. For a printed version on kraft paper, you use the 40% tint (#D3A17C) as a divider only, never as text.

Look at burnt orange for a stronger orange and bronze for a more golden metal. For a full seasonal set, see the fall color palettes. To check any pair yourself, use the contrast checker.

Sources

  1. xkcd, Color survey results: the 954 most common color names (Randall Munroe, 2010; checked 2026-11-10) xkcd.com
  2. xkcd, Color survey results (blog post by Randall Munroe, 2010; checked 2026-11-10) blog.xkcd.com
  3. W3C, Web Content Accessibility Guidelines (WCAG) 2.2: contrast minimum (checked 2026-11-10) w3.org