A vivid dark blue, white text passes AA
What color is blue?
blue is a vivid dark blue: #0000ff in hex, rgb(0 0 255). White text on it reaches 8.59:1, passing WCAG AAA. Recolor (recolor.page) shows it on a real page below.
Last updated
| Format | Value |
|---|---|
| Keyword | blue |
| Hex | #0000ff |
| RGB | rgb(0 0 255) |
| HSL | hsl(240 100% 50%) |
| OKLCH | oklch(45.2% 0.313 264.1) |
| Nearest Tailwind color | blue-700 #1447e6, 0.079 away in OKLab |
| White text | 8.59:1: AA passes, AAA passes, large text passes |
| Black text | 2.44:1: AA fails, AAA fails, large text fails |
About blue
A vivid dark blue is the plain description of blue: OKLCH lightness 45.2%, chroma 0.313, hue 264.1 degrees. It is one of the 16 named colors that CSS Color 4 traces to the VGA palette, by way of HTML; most of the others came from the X11 color system.
HSL and OKLCH agree on how light it is, 50% and 45.2%. The nearest CSS named color, mediumblue (#0000cd), is 0.083 away in OKLab: related, but plainly a different color.
White text on blue measures 8.59:1, past the 7:1 of WCAG AAA, while black text manages only 2.44:1. In the hue-sorted table of named colors it sits between royalblue and mediumblue.
In Tailwind CSS 4.3.3 the nearest default color is blue-700 (#1447e6), 0.079 away in OKLab; for the exact color, an arbitrary value such as bg-[#0000ff] works.
Tints and shades
- #cfe1ff
- #a1c3ff
- #74a3ff
- #4780ff
- #1957ff
- #0000ff
- #0000c8
- #000094
- #000063
- #000036
- #00000f
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
- #0000ff
- #dab191
- #162233
- #4c7fd0
- #ffdcc2
Recolor's generator, with blue locked as swatch 1 and the seed taken from its hex, drew a split-complementary palette, built on the two hues beside its opposite: #dab191, #162233, #4c7fd0, #ffdcc2. Open it in Recolor.
Using blue
As a text color, blue on a white page gives the same 8.59:1.
.notice {
background-color: blue; /* #0000ff */
color: white; /* 8.59:1 */
}Common questions
Does white text pass WCAG AA on blue?
Yes. White text measures 8.59:1 on blue, above the 4.5:1 that WCAG AA asks of body text, and above AAA's 7:1 too.
Can blue be written in OKLCH?
Yes: oklch(45.2% 0.313 264.1), computed from #0000ff. A named color is an sRGB color, so its OKLCH value converts back to the same hex.
Is there a named color close to blue?
No. The nearest, mediumblue (#0000cd), is 0.083 away in OKLab, a different color.