Skip to content
ColorPlum

Colors · value from the CSS Color Module Level 4 (W3C)

Dark red color: hex code #8B0000, RGB and palettes

Dark red is #8B0000 (RGB 139, 0, 0), the CSS color darkred: red at about half strength with no green or blue. White text on it measures 10.01:1, and it passes comfortably as text on white.

ColorPlum swatchDark reddark, saturated red
HEX
#8B0000
RGB
rgb(139, 0, 0)
HSL
hsl(0, 100%, 27%)

Best text on it: white at 10.01:1

Copy codes as

Every code for Dark red

  • HEX#8B0000
  • RGBrgb(139, 0, 0)
  • HSLhsl(0, 100%, 27%)
  • HSV0°, 100%, 55%
  • CMYK0%, 100%, 100%, 45%
  • Lablab(28.8% 51.5 42.8)
  • OKLCHoklch(40% 0.164 29.2)
  • Decimal9109504

Tints, shades and tones

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

  1. 90%#F3E6E6
  2. 80%#E8CCCC
  3. 70%#DCB3B3
  4. 60%#D19999
  5. 50%#C58080
  6. 40%#B96666
  7. 30%#AE4D4D
  8. 20%#A23333
  9. 10%#971A1A
  10. Base#8B0000
  11. 10%#7D0000
  12. 20%#6F0000
  13. 30%#610000
  14. 40%#530000
  15. 50%#460000
  16. 60%#380000
  17. 70%#2A0000
  18. 80%#1C0000
  19. 90%#0E0000

Tones (mixed with gray)

  1. 10%#8A0D0D
  2. 20%#891A1A
  3. 30%#882626
  4. 40%#873333
  5. 50%#864040
  6. 60%#844D4D
  7. 70%#835A5A
  8. 80%#826666
  9. 90%#817373

Matching colors

Complementary
Analogous
Triadic
Split complementary
Tetradic (square)
Monochromatic
  • #140000
  • #3F0000
  • #8B0000
  • #D70000
  • #FF2525

Dark red 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.

Dark red with its complement, its triad and its tint and shade
  • Dark red
  • Triad #008B00
  • Triad #00008B
  • Complement
  • 50% tint
  • 50% shade

Dark red in use

New collectionAutumn edit

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

Shop nowTag

Headline in Dark red

A paragraph with a link set in this color, which is dark enough for text on white.

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#8B0000
  • Protanopia (no red cones)#383000
  • Deuteranopia (no green cones)#574C00
  • Tritanopia (no blue cones)#9A0004

Contrast and readability

PairingRatioWCAG 2.2
as text on white10.01:1AA AA large AAA
as text on black2.09:1AA AA large AAA
white text on it10.01:1AA AA large AAA
black text on it2.09:1AA AA large AAA
on your background8.74:1AA AA large AAA

Export

:root {
  --dark-red: #8b0000;
  --dark-red-rgb: 139 0 0;
  --dark-red-on: #ffffff;
}
On this page

Dark red does exactly what its name says: it is red turned down until it feels heavy and serious. The value ColorPlum uses is the CSS named color darkred, #8B0000. Because it is in the CSS list, you can type darkred instead of the hex code in any stylesheet and get the same color.

What the numbers say

The RGB values are 139, 0, 0: red at roughly 55% of its range, and nothing else. That makes the HSL reading very clean, hue 0°, 100% saturation, 27% lightness. In CMYK it is 0%, 100%, 100%, 45%, a simple conversion that a print shop will adjust to its own inks. The decimal form is 9109504 if a tool asks for a single integer.

Because there is no green or blue at all, darkred is a pure red hue and looks hotter than burgundy or wine. In the xkcd survey, the color people named "dark red" is #840000, only 1.6 apart in OKLab, which is close enough that most people could not tell them apart on a screen. The CSS list's own close neighbor is maroon (#800000), at a distance of 2.5. Browns and brick tones are further away: brown (#A52A2A) is 8.2 and firebrick (#B22222) is 9.8.

Choosing text and companions

  • White on dark red: 10.01:1, which clears the 7:1 AAA level. Black on it is poor, since the same color as text on black measures only 2.09:1.
  • Dark red as text: on white it also gives 10.01:1, so it makes a strong heading or link color. On the pale tint #F3E6E6 it still reaches 8.23:1.
  • Complement: the opposite is a dark cyan, #008B8B. Together they feel more vivid than red with green.
  • Neighbors on the wheel: the analogous picks are #8B0046 (toward crimson) and #8B4600 (toward brown).

Shade steps go from #7D0000 to #0E0000, and tints from #971A1A to #F3E6E6. The 80% tint, #E8CCCC, is a dusty rose that holds dark red text at 6.64:1.

Worked example

Imagine you build a website for a charity bake sale and need a "Donate" button that is clearly the main action. You fill the button with dark red and set the label in white, which gives 10.01:1. The hover state steps one notch darker to #610000, which keeps white text at 13.92:1, so the button never gets harder to read when someone points at it. Beside it you put a secondary link in the same red on the pale #F3E6E6 panel. Everything passes without any extra tuning, and the red is strong enough that the button still stands out on a mostly white page.

For a version with a hint of blue, compare burgundy. For a slightly browner red, see maroon, and for a brighter one, crimson. You can also test a pairing in the contrast checker.

Sources

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