Named color · #5588FF
Skinny Jeans
Skinny Jeans is #5588FF: rgb(85 136 255), hsl(222 100% 67%), oklch(0.651 0.185 264.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Blue mean? → · Skinny Jeans color name →
#5588FF
oklch(0.651 0.185 264.4)
Color conversions
- HEX
- #5588ff
- RGB
- rgb(85 136 255)
- HSL
- hsl(222 100% 67%)
- HWB
- hwb(222 33% 0%)
- OKLCH
- oklch(0.651 0.185 264.4)
- OKLab
- oklab(0.651 -0.018 -0.184)
- CIE Lab
- lab(57.78 12.08 -65.6)
- LCH
- lch(57.78 66.7 280.4)
- CMYK
- cmyk(67% 47% 0% 0%)
Tints · Shades · Tones
Tints
- 6595FF
- 76A2FF
- 86AEFF
- 97BAFF
- A8C6FF
- B9D1FF
- CADDFF
- DCE8FF
- EDF4FF
Shades
- 4975DE
- 3D63BE
- 31529E
- 264180
- 1C3163
- 112248
- 08132E
- 020616
- 000103
Tones
- 5A88F2
- 5E88E6
- 6388D9
- 6788CD
- 6C87C0
- 7086B4
- 7485A7
- 78839A
- 7C828D
Color harmonies
Complementary +180°
- 5588FF
Skinny Jeans
- B58700
≈ Letter Jacket
Analogous -30° +30°
- 5588FF
Skinny Jeans
- 009BD6
≈ Structural Blue
- 9973F3
≈ Forgotten Purple
Triadic +120° +240°
- 5588FF
Skinny Jeans
- EB5654
≈ Khmer Curry
- 30AB3C
≈ Vitalize
Split-complementary +150° +210°
- 5588FF
Skinny Jeans
- D96F00
≈ Gold Orange
- 8F9900
≈ Devil’s Flower Mantis
Tetradic +90° +180° +270°
- 5588FF
Skinny Jeans
- E15596
≈ Bit of Berry
- B58700
≈ Letter Jacket
- 00A88A
≈ Moray Eel
Contrast & accessibility
Ag
FailOn white
WCAG 3.30:1 · APCA Lc 60
Ag
AAOn black
WCAG 6.35:1 · APCA Lc 42
Best text color: #000000
WCAG 6.35:1 (AA) · APCA Lc 42
Contrast pairs
Code snippets
CSS
:root {
--skinny-jeans: #5588ff;
--skinny-jeans-rgb: 85 136 255;
--skinny-jeans-oklch: oklch(0.651 0.185 264.4);
}
.element {
color: var(--skinny-jeans);
background-color: hsl(222 100% 67%);
border-color: oklch(0.651 0.185 264.4);
}Tailwind CSS v4
@theme {
--color-skinny-jeans: #5588ff;
--color-skinny-jeans-50: #ddf5ff;
--color-skinny-jeans-100: #cbe7ff;
--color-skinny-jeans-200: #b0d2ff;
--color-skinny-jeans-300: #8cb3ff;
--color-skinny-jeans-400: #6699ff;
--color-skinny-jeans-500: #467cff;
--color-skinny-jeans-600: #3c69d7;
--color-skinny-jeans-700: #2f54ad;
--color-skinny-jeans-800: #1d3e81;
--color-skinny-jeans-900: #132b5b;
--color-skinny-jeans-950: #05173e;
}SCSS
$skinny-jeans: #5588ff;
$skinny-jeans-rgb: 85, 136, 255;
$skinny-jeans-light: mix(#fff, $skinny-jeans, 20%);
$skinny-jeans-dark: mix(#000, $skinny-jeans, 20%);
.element {
color: $skinny-jeans;
box-shadow: 0 0 0 2px rgba($skinny-jeans, 0.35);
}