HEX
#4682B4Primary tokenCSS Named Color Reference
Steel Blue Color Code
Steel Blue·#4682B4
Blue FamilyCoolMid toneMid saturationoklch(58.8% 0.099 246)
RGB
rgb(70, 130, 180)Screen valuesHSL
hsl(207 44% 49%)Hue and lightnessCMYK
61, 28, 0, 29Print handoffLAB
52, -4, -32Perceptual referenceOKLCH
oklch(58.8% 0.099 246)Modern perceptualSteel Blue is a muted CSS named blue at #4682B4 with a cooler, more grounded tone than Royal Blue or Dodger Blue. Use it when you need a professional interface blue for dashboards, product chrome, data surfaces, and dependable system accents.
Best text colorDark text
Body text contrast4.18:1
Best UseDashboards, side navigation, and dense product surfaces
Tonal Scale
100#DEE9F2
300#AAC6DD
500#6799C2
600#4682B4
800#325E82
Contrast Checks
White text on this color
Buttons, badges, and filled actions.
4.11:1Large text / UI only
Dark text on this color
Large headings and selective UI.
4.18:1Large text / UI only
This color on light surface
Links, borders, and icons on light UI.
3.90:1Large text / UI only
Best text colorDark textContrast 4.18:1
Professional Reference
OKLCHoklch(58.8% 0.099 246)
Relative Luminance0.2056
Source TypeCSS Named Color
Classification
Blue FamilyCoolMid toneMid saturation
Source Context
Source Type
CSS Named Color
System
CSS
Closest Matches
Flat UI Belize HoleTailwind Sky 600Tailwind Sky 700
Accessibility Matrix
White text on this color
White text placed on the current color.
4.11:1Large text / UI only
Dark text on this color
Dark text or headings on the current color.
4.18:1Large text / UI only
This color on light surface
Use this color for links, strokes, or icons on light UI.
3.90:1Large text / UI only
This color on dark surface
Use this color inside dark shells for strokes, tags, or icons.
4.18:1Large text / UI only
Best text colorDark textContrast 4.18:1 · Large text / UI only
Where It Works
- Dashboards, side nav, tables, and product chrome.
- Calmer than vivid blues, friendlier than navy.
- Pairs with off-white, charcoal neutrals, and pale blue-grays.
Reference Notes
Last Updated
2026-06-25
Source Library
CSS Standard Colors
Methodology
Verified source values + site guidance
Color Notes
Steel Blue is sourced from the published CSS Standard Colors library and retained here as a searchable reference swatch for product and interface reference work.
Hue Family
Trust-building blues for enterprise and SaaS.
Source Collections
CSS Named Colors
Related Colors
Palette Starting Points
Implementation Snippets
:root {
--color-steel-blue: #4682B4;
--color-steel-blue-rgb: 70 130 180;
}class="bg-[#4682B4] text-white"
class="hover:bg-[#325E82] ring-1 ring-[#4682B4]"{
"steelBlue": "#4682B4",
"steelBlueRgb": [70, 130, 180],
"steelBlueHsl": [207, 44, 49]
}