Named color · #5DADEC
Blue Jeans
Blue Jeans is #5DADEC: rgb(93 173 236), hsl(206 79% 65%), oklch(0.723 0.121 244.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Blue mean? → · Blue Jeans color name →
#5DADEC
oklch(0.723 0.121 244.4)
Color conversions
- HEX
- #5dadec
- RGB
- rgb(93 173 236)
- HSL
- hsl(206 79% 65%)
- HWB
- hwb(206 36% 7%)
- OKLCH
- oklch(0.723 0.121 244.4)
- OKLab
- oklab(0.723 -0.052 -0.109)
- CIE Lab
- lab(67.63 -11.22 -39.67)
- LCH
- lch(67.63 41.22 254.2)
- CMYK
- cmyk(61% 27% 0% 7%)
Tints · Shades · Tones
Tints
- 6FB5EE
- 80BEF1
- 91C6F3
- A1CEF5
- B1D7F7
- C0DFF9
- D0E7FB
- E0EFFC
- EFF7FE
Shades
- 5096CD
- 437FAF
- 376A92
- 2A5576
- 1F415B
- 142D42
- 0A1B29
- 030B13
- 000103
Tones
- 63A9E1
- 67A4D6
- 6CA0CB
- 709CC0
- 7397B6
- 7693AB
- 798EA0
- 7C8995
- 7E858B
Color harmonies
Complementary +180°
- 5DADEC
Blue Jeans
- DA944D
≈ Brushed Clay
Analogous -30° +30°
- 5DADEC
Blue Jeans
- 23B8D4
≈ Ocean Sigh
- 8F9FF1
≈ Cold Lips
Triadic +120° +240°
- 5DADEC
Blue Jeans
- E4849C
≈ Iced Berry
- 95B259
≈ Asparagus Cream
Split-complementary +150° +210°
- 5DADEC
Blue Jeans
- E78871
≈ Thundelarra
- BEA441
≈ Forest Tent
Tetradic +90° +180° +270°
- 5DADEC
Blue Jeans
- D488C4
≈ Cyclamen
- DA944D
≈ Brushed Clay
- 61BC83
≈ Spearmint Burst
Contrast & accessibility
Ag
FailOn white
WCAG 2.42:1 · APCA Lc 48
Ag
AAAOn black
WCAG 8.65:1 · APCA Lc 54
Best text color: #000000
WCAG 8.65:1 (AAA) · APCA Lc 54
Contrast pairs
Code snippets
CSS
:root {
--blue-jeans: #5dadec;
--blue-jeans-rgb: 93 173 236;
--blue-jeans-oklch: oklch(0.723 0.121 244.4);
}
.element {
color: var(--blue-jeans);
background-color: hsl(206 79% 65%);
border-color: oklch(0.723 0.121 244.4);
}Tailwind CSS v4
@theme {
--color-blue-jeans: #5dadec;
--color-blue-jeans-50: #daf9ff;
--color-blue-jeans-100: #c8edff;
--color-blue-jeans-200: #aadaff;
--color-blue-jeans-300: #83bef2;
--color-blue-jeans-400: #5ba6e1;
--color-blue-jeans-500: #2e8dd0;
--color-blue-jeans-600: #2977b0;
--color-blue-jeans-700: #215f8d;
--color-blue-jeans-800: #134669;
--color-blue-jeans-900: #0c3149;
--color-blue-jeans-950: #011d30;
}SCSS
$blue-jeans: #5dadec;
$blue-jeans-rgb: 93, 173, 236;
$blue-jeans-light: mix(#fff, $blue-jeans, 20%);
$blue-jeans-dark: mix(#000, $blue-jeans, 20%);
.element {
color: $blue-jeans;
box-shadow: 0 0 0 2px rgba($blue-jeans, 0.35);
}