Dusty Blue #5A86AD

Dusty Blue is a medium-dark, moderately saturated blue with hex code #5A86AD and RGB rgb(90, 134, 173).

Aa

Black text reads best on this color (5.44:1).

About this color

#5A86AD is a medium-dark, moderately saturated blue. In OKLCH its lightness is 60%, its chroma 0.077 and its hue 246°. Its hue sits on the cool side of the wheel. It is the named color Dusty Blue. Black text reads best on it, at 5.44:1.

Hue familyBlues
Lightnessmedium-dark (60%)
Chromamoderately saturated (0.077)
Temperaturecool
Nearest nameDusty Blue
Black text5.44:1
White text3.85:1

Colors that go with Dusty Blue

Matches found by rotating Dusty Blue around the OKLCH hue wheel, each labelled with the closest name in our list.

Complementary

The opposite hue (180°).

Open the complementary palette in the generator

Color palettes with Dusty Blue

Curated color palettes that contain a color within ΔE 0.06 (OKLab) of Dusty Blue, closest first.

Similar named colors

The eight named colors closest to Dusty Blue, with their ΔE distance.

More about Dusty Blue

How to make Dusty Blue

A starting recipe from common paint colors, found with a spectral paint model (the color mixer’s paint mode). Real pigments vary, so mix a small test batch and adjust.

  • 4 parts pink
  • 3 parts blue
  • 1 part green

Recipe result: #5D85B0, a difference of ΔE 0.008 from Dusty Blue. That is very close: most people will not see the difference.

What colors make blue? | Color mixing chart

Codes for Dusty Blue in every format

HEX#5A86AD
RGBrgb(90, 134, 173)
HSLhsl(208, 34%, 52%)
OKLCHoklch(60.4% 0.077 246.2)

Contrast

WCAG 2 contrast ratios are the conformance target: AA needs 4.5:1 for body text and 3:1 for large text, AAA needs 7:1. APCA Lc values are supplementary guidance from the WCAG 3 drafts.

PairWCAG 2ResultAPCAAPCA guidance
White text on #5A86AD 3.85:1 AA large text Lc -71.4 Content text, not long reading
Black text on #5A86AD 5.44:1 AA Lc 38.1 Non-text elements, placeholder text
#5A86AD text on white 3.85:1 AA large text Lc 65.9 Content text, not long reading
#5A86AD text on black 5.44:1 AA Lc -35.7 Non-text elements, placeholder text

Shades and tints of Dusty Blue

A 50–950 scale built in OKLCH: the hue is held, lightness follows a Tailwind v4-like curve, and every step is kept inside the sRGB gamut. This color sits at step 500.

  1. Step 50

    50

    #F3F6F9

    oklch(97.2% 0.005 247.9)

  2. Step 100

    100

    #E4EBF1

    oklch(93.6% 0.011 243.7)

  3. Step 200

    200

    #CEDBE6

    oklch(88.5% 0.021 243.4)

  4. Step 300

    300

    #AEC4D8

    oklch(81% 0.037 245.7)

  5. Step 400

    400

    #82A5C4

    oklch(70.7% 0.06 245.5)

  6. Step 500

    500 (this color)

    #5A86AD

    oklch(60.4% 0.077 246.2)

  7. Step 600

    600

    #4878A2

    oklch(55.7% 0.084 246.4)

  8. Step 700

    700

    #39658A

    oklch(49.2% 0.077 245.6)

  9. Step 800

    800

    #305270

    oklch(42.6% 0.064 246.6)

  10. Step 900

    900

    #2B445B

    oklch(37.7% 0.05 247.3)

  11. Step 950

    950

    #192835

    oklch(27% 0.032 245.5)

Export this scale for Tailwind in the Tailwind colors tool

Dusty Blue with color blindness

Simulated with the Machado et al. (2009) model. ΔE is how far the color moves: below about 0.02 you would not notice a change.

VisionSeen asShift (ΔE)
Protanopia (no red cones)#7687AF0.035
Deuteranopia (no green cones)#6B7EAC0.028
Tritanopia (no blue cones)#358F930.065
Achromatopsia (no color)#8282820.077

Use Dusty Blue in your product

Turn it into light and dark UI roles checked for contrast, then export to Tailwind v4, shadcn/ui, CSS or design tokens.