Blue Color (#0000FF)

A fully saturated blue to compare for links and headings. CSS value: #0000FF.

Color value

Use HEX, RGB, HSL or a CSS color name, without transparency.

Normalized color

CSS names:

Compare black and white text

This compares black and white text on the selected background. Check the result for your text size before choosing either one.

Color relationships

Tints toward white

Shades toward black

Five steps mix the sRGB channels toward white or black: 0%, 25%, 50%, 75% and 100%. Equal numeric steps may not look equally spaced.

Supported color inputs and errors →

Blue hex and RGB values

The CSS keyword blue gives you #0000FF, or rgb(0, 0, 255).

CSS blue is the fully saturated #0000FF value. For links, keep an underline or another visible cue as well as a measured text color.

Compare black and white text

Text / backgroundRatioAA normalAA largeAAA normalAAA large
#000000 / #0000FF2.44:1FailFailFailFail
#FFFFFF / #0000FF8.59:1PassPassPassPass

White text has the higher contrast on blue: 8.59:1. The table compares both options against all four text thresholds, using the unrounded values for pass or fail.

Try blue in a layout

The CSS sample below uses white text on #0000FF. Preview a 16 px label and a 24 px heading to compare normal and large text. Swap the colors to try blue as the text color; the ratio stays the same.

.sample {
  background: #0000FF;
  color: #FFFFFF;
}

Copy the exact color

Use the converter to copy HEX, RGB or HSL. If you edit in HSL, the final value is rounded to eight-bit sRGB so the preview and exported color agree. For text over an image, gradient or translucent layer, check the finished design separately.

Sources and further reading