A vivid medium red-orange, black text passes AA
What color is orangered?
The CSS named color orangered is #ff4500, or rgb(255 69 0): a vivid medium red-orange in plain words. Black text on it reaches 6.10:1, passing WCAG AA, and Recolor (recolor.page) can put it on a real page.
Last updated
| Format | Value |
|---|---|
| Keyword | orangered |
| Hex | #ff4500 |
| RGB | rgb(255 69 0) |
| HSL | hsl(16 100% 50%) |
| OKLCH | oklch(66.0% 0.229 35.4) |
| Nearest Tailwind color | orange-600 #f54a00, 0.019 away in OKLab |
| White text | 3.44:1: AA fails, AAA fails, large text passes |
| Black text | 6.10:1: AA passes, AAA fails, large text passes |
About orangered
A vivid medium red-orange is the plain description of orangered: OKLCH lightness 66.0%, chroma 0.229, hue 35.4 degrees.
Its HSL lightness, 50%, says little about how light orangered looks; OKLCH, made to match the eye, measures 66.0%, 16 points away. No CSS keyword matches it; red (#ff0000) is the nearest, 0.050 away in OKLab, a clear step off.
Black text on orangered reaches 6.10:1, enough for WCAG AA body text but short of AAA's 7:1; white text gets 3.44:1. Its neighbors in the hue-sorted list of names are coral and papayawhip.
The closest Tailwind 4.3.3 color is orange-600, 0.019 away in OKLab, so bg-orange-600 comes very close; bg-[#ff4500] gives the color itself.
Tints and shades
- #ffe4db
- #ffc8b8
- #ffac94
- #ff8e6f
- #ff6e47
- #ff4500
- #c83400
- #942400
- #631500
- #360700
- #0f0100
From light to dark: 5 toward white and 5 toward black, mixed in OKLCH a sixth of the way at a time with the hue kept. A step that would repeat its neighbor is left out.
A palette around it
- #ff4500
- #f3efc2
- #1f1c2e
- #96d4d7
- #714f3f
Recolor's generator, with orangered locked as swatch 1 and the seed taken from its hex, drew a free palette, hues spread around the wheel: #f3efc2, #1f1c2e, #96d4d7, #714f3f. Open it in Recolor.
Using orangered
As a text color, orangered on a black page gives the same 6.10:1.
.notice {
background-color: orangered; /* #ff4500 */
color: black; /* 6.10:1 */
}Common questions
Does white text pass WCAG AA on orangered?
No. White text measures 3.44:1 on orangered, under AA's 4.5:1; black text measures 6.10:1 and passes.
Can orangered be written in OKLCH?
Yes: oklch(66.0% 0.229 35.4), computed from #ff4500. A named color is an sRGB color, so its OKLCH value converts back to the same hex.
Is there a named color close to orangered?
No. The nearest, red (#ff0000), is 0.050 away in OKLab, a different color.