A dark teal, white text passes AA
What color is darkslategray?
darkslategray is a dark teal: #2f4f4f in hex, rgb(47 79 79). White text on it reaches 8.93:1, passing WCAG AAA. Recolor (recolor.page) shows it on a real page below.
Last updated
| Format | Value |
|---|---|
| Keyword | darkslategray, also darkslategrey |
| Hex | #2f4f4f |
| RGB | rgb(47 79 79) |
| HSL | hsl(180 25% 25%) |
| OKLCH | oklch(40.3% 0.038 195.8) |
| Nearest Tailwind color | teal-900 #0b4f4a, 0.031 away in OKLab |
| White text | 8.93:1: AA passes, AAA passes, large text passes |
| Black text | 2.35:1: AA fails, AAA fails, large text fails |
About darkslategray
Measured in OKLCH, darkslategray comes out at lightness 40.3%, chroma 0.038 and hue 195.8 degrees: a dark teal. CSS accepts two spellings for it, darkslategray and darkslategrey, with the same value; darkslategrey leads to this page.
HSL puts its lightness at 25% and OKLCH at 40.3%, 16 points apart: HSL's lightness does not follow what the eye sees, OKLCH's is built to. No CSS named color comes near it: the closest, dimgray (#696969), is 0.124 away in OKLab.
White on darkslategray reads at 8.93:1, enough for AAA body text; black reaches 2.35:1 and should stay off it. In the hue-sorted table of named colors it sits between teal and lightskyblue.
In Tailwind CSS 4.3.3 the nearest default color is teal-900 (#0b4f4a), 0.031 away in OKLab; for the exact color, an arbitrary value such as bg-[#2f4f4f] works.
Tints and shades
- #dadfdf
- #b5c1c0
- #92a3a3
- #708686
- #4f6a6a
- #2f4f4f
- #233c3c
- #172a2a
- #0c1919
- #030a0a
- #000101
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
- #2f4f4f
- #f5f3de
- #3a8db1
- #082a3a
- #dfbecf
Around darkslategray as swatch 1, Recolor's generator made a triadic palette, three hues a third of the wheel apart: #f5f3de, #3a8db1, #082a3a, #dfbecf, drawn from a seed fixed by its hex. Open it in Recolor.
Using darkslategray
As a text color, darkslategray on a white page gives the same 8.93:1.
.notice {
background-color: darkslategray; /* #2f4f4f */
color: white; /* 8.93:1 */
}Common questions
Does white text pass WCAG AA on darkslategray?
Yes. White text measures 8.93:1 on darkslategray, above the 4.5:1 that WCAG AA asks of body text, and above AAA's 7:1 too.
Can darkslategray be written in OKLCH?
Yes: oklch(40.3% 0.038 195.8), computed from #2f4f4f. A named color is an sRGB color, so its OKLCH value converts back to the same hex.
Is there a named color close to darkslategray?
No. The nearest, dimgray (#696969), is 0.124 away in OKLab, a different color.