Loading...

Shades of Blue

25 named blue shades with hex codes — click any swatch to copy.

Find Closest Blue Shade

Enter any hex code to find the nearest named blue shade.

Blue is the most universally beloved color. From the softest powder blue to the darkest midnight, blue shades span the full range of calm, trust, and depth. Use lighter blues for airiness and sky-inspired palettes; deeper blues for authority, professionalism, and ocean themes.

All Blue Shades

Alice Blue

#F0F8FF

Lavender Blue

#CCCCFF

Columbia Blue

#C4D8E2

Powder Blue

#B0E0E6

Light Blue

#ADD8E6

Baby Blue

#89CFF0

Sky Blue

#87CEEB

Light Sky Blue

#87CEFA

Deep Sky Blue

#00BFFF

Electric Blue

#7DF9FF

Cornflower Blue

#6495ED

Cadet Blue

#5F9EA0

Dodger Blue

#1E90FF

Steel Blue

#4682B4

Cerulean

#007BA7

Picton Blue

#45B5E0

Blue

#0000FF

Royal Blue

#4169E1

Medium Blue

#0000CD

Denim Blue

#1560BD

Cobalt Blue

#0047AB

Navy Blue

#000080

Dark Navy

#001F3F

Midnight Blue

#191970

Prussian Blue

#003153

Using Blue Shades in Design

Light shades

Pale blue shades make excellent backgrounds, hover states, and subtle accents. They keep designs airy without losing the hue's personality.

Mid-range shades

The middle of the blue spectrum is where most UI elements live — buttons, icons, links, and borders. These shades are vivid enough to pop without overwhelming.

Dark shades

Deep blue shades work for text on light backgrounds, dark mode surfaces, and dramatic hero sections. They're rich and authoritative.

Building a palette

Pick one blue shade as your primary, one light variant for backgrounds, and one dark variant for depth. Add a neutral gray for balance.

Related Color Families