CSS named color
OrangeRed #FF4500
OrangeRed is a vivid orange with the hex code #FF4500, which converts to rgb(255, 69, 0). Open #FF4500 in the converter to tweak it.
OrangeRed color values
| HEX | #FF4500 |
|---|---|
| HEX (shorthand) | — |
| RGB | rgb(255, 69, 0) |
| RGBA | rgba(255, 69, 0, 1) |
| 8-digit HEX | #FF4500FF |
| HSL | hsl(16, 100%, 50%) |
| HSV / HSB | 16°, 100%, 100% |
| CMYK | 0%, 73%, 100%, 0% |
| RGB 0–1 | 1, 0.271, 0 |
| Decimal | 16729344 |
| CSS keyword | orangered |
How #FF4500 converts to RGB
Split the hex code into three pairs and read each pair as a base-16 number: FF → 255, 45 → 69, 00 → 0. That gives rgb(255, 69, 0). The step-by-step guide explains the math.
Shades of OrangeRed
Mixed toward black in 10% steps. Click a swatch to copy its hex.
Tints of OrangeRed
Mixed toward white in 10% steps.
Color harmonies
Hue rotations of OrangeRed on the HSL color wheel, keeping saturation and lightness fixed. The color harmony guide explains when each scheme works.
Complementary
Analogous
Split-complementary
Triadic
Tetradic (square)
Contrast and accessibility
| Text | Background | Ratio | WCAG 2.x |
|---|---|---|---|
| White | OrangeRed | 3.44:1 | AA Large only |
| Black | OrangeRed | 6.10:1 | AA |
Use black text on a orangered background. Test any other pair in the contrast checker; thresholds are explained in the WCAG contrast guide.
Use OrangeRed in CSS
.element {
color: orangered; /* keyword */
background-color: #FF4500; /* hex */
border-color: rgb(255 69 0 / 50%); /* 50% transparent */
}Need it semi-transparent? Append an alpha byte: #FF450080 is OrangeRed at 50% opacity. See RGBA & transparency.
Similar named colors
FAQ
What is the HEX code for OrangeRed?
The CSS named color orangered is #FF4500 in hexadecimal. In CSS you can write color: orangered; or color: #FF4500; — both produce the same pixel.
What is OrangeRed in RGB?
OrangeRed is rgb(255, 69, 0): red 255, green 69, blue 0 on the 0–255 scale. As normalized 0–1 floats that is (1, 0.271, 0).
Is white or black text more readable on OrangeRed?
Black text is more readable. White on #FF4500 has a contrast ratio of 3.44:1 (AA Large only), black on #FF4500 has 6.10:1 (AA). WCAG AA needs 4.5:1 for normal text.