Shades of Blue
Blue sits between cyan and violet, covering roughly 200 to 260 degrees on the HSL color wheel. It is associated with water, sky, calm, technology and trust, which makes it the most common primary color in software and corporate brands.
49 blue colors, lightest to darkest
Click a swatch to copy its HEX code. Click the name for the full profile with HSL, LAB, OKLCH, harmonies and contrast.
- Alice Bluergb(240, 248, 255)
C6 M3 Y0 K0 - Periwinklergb(204, 204, 255)
C20 M20 Y0 K0 - Powder Bluergb(176, 224, 230)
C23 M3 Y0 K10 - Light Bluergb(173, 216, 230)
C25 M6 Y0 K10 - Light Steel Bluergb(176, 196, 222)
C21 M12 Y0 K13 - Jordy Bluergb(138, 185, 241)
C43 M23 Y0 K5 - Sky Bluergb(135, 206, 235)
C43 M12 Y0 K8 - Medium Slate Bluergb(123, 104, 238)
C48 M56 Y0 K7 - Cornflowerrgb(100, 149, 237)
C58 M37 Y0 K7 - Ultramarinergb(65, 102, 245)
C73 M58 Y0 K4 - Picton Bluergb(69, 177, 232)
C70 M24 Y0 K9 - Carolina Bluergb(86, 160, 211)
C59 M24 Y0 K17 - Slate Bluergb(106, 90, 205)
C48 M56 Y0 K20 - Royal Bluergb(65, 105, 225)
C71 M53 Y0 K12 - Irisrgb(90, 79, 207)
C57 M62 Y0 K19 - Dodger Bluergb(30, 144, 255)
C88 M44 Y0 K0 - Tufts Bluergb(62, 142, 222)
C72 M36 Y0 K13 - Bleu de Francergb(49, 140, 231)
C79 M39 Y0 K9 - Han Bluergb(68, 108, 207)
C67 M48 Y0 K19 - Palatinate Bluergb(39, 59, 226)
C83 M74 Y0 K11 - Air Force Bluergb(93, 138, 168)
C45 M18 Y0 K34 - Bluergb(0, 0, 255)
C100 M100 Y0 K0 - Azurergb(0, 127, 255)
C100 M50 Y0 K0 - Brandeis Bluergb(0, 112, 255)
C100 M56 Y0 K0 - Electric Indigorgb(111, 0, 255)
C56 M100 Y0 K0 - Steel Bluergb(70, 130, 180)
C61 M28 Y0 K29 - Celtic Bluergb(36, 107, 206)
C83 M48 Y0 K19 - Cerulean Bluergb(42, 82, 190)
C78 M57 Y0 K25 - Persian Bluergb(28, 57, 187)
C85 M70 Y0 K27 - Denimrgb(21, 96, 189)
C89 M49 Y0 K26 - Medium Bluergb(0, 0, 205)
C100 M100 Y0 K20 - Sapphirergb(15, 82, 186)
C92 M56 Y0 K27 - Dark Slate Bluergb(72, 61, 139)
C48 M56 Y0 K45 - French Bluergb(0, 114, 187)
C100 M39 Y0 K27 - Egyptian Bluergb(16, 52, 166)
C90 M69 Y0 K35 - Cobaltrgb(0, 71, 171)
C100 M58 Y0 K33 - Zaffrergb(0, 20, 168)
C100 M88 Y0 K34 - International Klein Bluergb(0, 47, 167)
C100 M72 Y0 K35 - Sapphire Bluergb(0, 103, 165)
C100 M38 Y0 K35 - Yale Bluergb(15, 77, 146)
C90 M47 Y0 K43 - Duke Bluergb(0, 0, 156)
C100 M100 Y0 K39 - Dark Bluergb(0, 0, 139)
C100 M100 Y0 K45 - Midnight Bluergb(25, 25, 112)
C78 M78 Y0 K56 - Phthalo Bluergb(0, 15, 137)
C100 M89 Y0 K46 - Indigorgb(75, 0, 130)
C42 M100 Y0 K49 - Navyrgb(0, 0, 128)
C100 M100 Y0 K50 - Catalina Bluergb(6, 42, 120)
C95 M65 Y0 K53 - Prussian Bluergb(0, 49, 83)
C100 M41 Y0 K67 - Oxford Bluergb(0, 33, 71)
C100 M54 Y0 K72
Tints and shades of blue #0000FF
A perceptual 50 to 950 scale built from the pure blue. Same hue, stepped lightness.
Build this scale from any color with the color scale tool, or get it as a Tailwind config from the Tailwind palette generator.
Light, medium and dark blue
Blue tints become airy and pastel, muted tones become slate-like, and dark shades move toward navy. Classic examples include Light Blue #ADD8E6, Royal Blue #4169E1 and Navy #000080.
How to use blue in design
Blue contrasts with orange and combines naturally with cyan, teal and violet. A single blue hue stepped through lightness makes a complete monochromatic UI palette. Deep blues reproduce well in print, but pure RGB blue #0000FF shifts toward purple in CMYK, so brand-critical conversions should be checked with a proof.
FAQ
What is the HEX code for pure blue?
Pure RGB blue is #0000FF. It uses full blue with no red or green.
What is a classic shade of blue?
Navy #000080 is a classic dark blue. Royal Blue #4169E1 provides a brighter medium-dark option.
What colors go with blue?
Orange creates complementary contrast. Teal, cyan, purple, white, gray, beige and yellow also work effectively with blue.