Steel Blue

#4682B4

What color is Steel Blue?

Steel blue is a medium blue with a cool, slightly muted tone, hex #4682B4, close to a clear winter sky. It has more gray in it than a bright sky blue, giving it a calm, subdued quality.

What is the meaning of the color Steel Blue?

Named after the blue-gray surface of tempered steel, the color reflects the industrial materials that defined 19th-century manufacturing. As steel production expanded across Europe and North America through the mid-1800s, the distinctive blue-gray sheen of worked metal became a recognized visual reference. The name steel blue was first recorded in English in 1817. The United States Naval Academy has long incorporated steel blue tones into uniform and institutional design, anchoring the color to themes of service and precision.

RGB
70, 130, 180
HSL
207°, 44%, 49%
CMYK
61, 28, 0, 29
HSV
207°, 61%, 71%
Steel blue color

What colors go with Steel Blue?

Colors that pair well with Steel blue include:
White: clean, open contrast
Navy: deep tonal depth
Warm beige: softens cool tone
Burnt orange: bold warm contrast
Charcoal gray: grounded, balanced pairing

Similar Colors

Conversions & Codes

Format Value CSS
HEX #4682B4 color: #4682B4;
RGB 70, 130, 180 color: rgb(70, 130, 180);
RGB Percentage 27%, 51%, 71% color: rgb(27%, 51%, 71%);
CMYK 61%, 28%, 0%, 29% Not supported in CSS
HSL 207°, 44%, 49% color: hsl(207, 44%, 49%);
HSV 207°, 61%, 71% Not supported in CSS
CIE-LAB 39, -12, -17 color: lab(39% -12 -17);
Decimal 4620980 Not supported in CSS

Color Variations

Shades

#4682B4
#3F75A2
#386890
#315B7E
#2A4E6C
#23415A
#1C3448
#152736

Tints

#C7DAE9
#B4CDE2
#A1C1DB
#8FB4D3
#7CA8CC
#699CC5
#568FBD
#4682B4

Tones

#4682B4
#4B82AE
#5181A9
#5681A3
#5C809E
#618098
#677F93
#6C7F8D

Hues

#4682B4
#5C46B4
#AE46B4
#B44667
#B47746
#9EB446
#4BB446
#46B493

Color Harmonies

Analogous

#46B4AE
Click to copy
#4682B4
Click to copy
#464BB4
Click to copy

Complementary

#4682B4
Click to copy
#B47746
Click to copy

Split Complementary

#4682B4
Click to copy
#B4464B
Click to copy
#B4AE46
Click to copy

Triadic

#4682B4
Click to copy
#B44682
Click to copy
#82B446
Click to copy

Tetradic

#4682B4
Click to copy
#AE46B4
Click to copy
#B47746
Click to copy
#4BB446
Click to copy

Square

#4682B4
Click to copy
#AE46B4
Click to copy
#B47746
Click to copy
#4BB446
Click to copy

CSS & Dev Snippets

CSS
.steel-blue {
  color: #4682B4;
}
SCSS
$steel-blue: #4682B4;
RGB
rgb(70, 130, 180)

Accessibility & Contrast

White background

4.11:1
4.11
contrast ratio on a white background
Element
AA
AAA
Small text
Large text
UI element

Black background

5.11:1
5.11
contrast ratio on a black background
Element
AA
AAA
Small text
Large text
UI element

Popular Tags