Shades of Blue
Blues cover roughly 200° to 250° on the HSL wheel, with pure blue at 240°. Blue is the darkest fully saturated hue: pure #0000FF has a relative luminance of only 0.0722, and in OKLCH its lightness is far below yellow's. That gives the family a wide usable range, from pale sky tints to deep navies that read almost as black, with the grayer steel and slate blues in between. In RGB, pure blue is rgb(0, 0, 255); adding green shifts it toward azure and sky tones, while adding red pushes it toward violet.
Navy (#000080) is pure blue at half intensity. Royalblue (#4169E1) sits at 225°, and dodgerblue (#1E90FF) at 210°, leaning toward cyan. Steelblue (#4682B4) has low saturation for a cool, businesslike tone, and skyblue (#87CEEB) is a light tint used for backgrounds and illustrations.
17 blue CSS color names
Sorted from lightest to darkest by OKLCH lightness. Open any color for its codes, shades, harmonies and contrast.
Using blue in design
Blue is the most common brand color in finance, technology and healthcare because it reads as calm and trustworthy. It is also the web's default link color, so users already expect blue text to be clickable, and blue is the usual choice for info states and focus rings. Dark navies make a softer alternative to black for text and dark themes.
Accessibility tip: mid blues look strong but can fail as text. Dodgerblue #1E90FF on white measures only 3.23:1, below the 4.5:1 AA minimum, while royalblue #4169E1 reaches 4.84:1. Pure blue on black is also weak at 2.44:1, so lighten blues for dark mode.