Named color · #59A1EF
Feather Star
Feather Star is #59A1EF: rgb(89 161 239), hsl(211 82% 64%), oklch(0.696 0.136 252). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Blue mean? → · Feather Star color name →
#59A1EF
oklch(0.696 0.136 252)
Color conversions
- HEX
- #59a1ef
- RGB
- rgb(89 161 239)
- HSL
- hsl(211 82% 64%)
- HWB
- hwb(211 35% 6%)
- OKLCH
- oklch(0.696 0.136 252)
- OKLab
- oklab(0.696 -0.042 -0.13)
- CIE Lab
- lab(64.16 -5.12 -46.72)
- LCH
- lch(64.16 47 263.7)
- CMYK
- cmyk(63% 33% 0% 6%)
Tints · Shades · Tones
Tints
- 6BABF1
- 7CB4F4
- 8DBEF6
- 9DC7F7
- ADD1F9
- BEDAFB
- CEE3FC
- DEEDFD
- EFF6FE
Shades
- 4C8BD0
- 4076B1
- 346294
- 284E78
- 1D3C5C
- 132A42
- 09192A
- 030914
- 000103
Tones
- 5F9EE4
- 649BD9
- 6898CE
- 6C95C3
- 7092B7
- 748EAC
- 778BA1
- 7A8796
- 7D848B
Color harmonies
Complementary +180°
- 59A1EF
Feather Star
- D18D28
≈ Vibrant Amber
Analogous -30° +30°
- 59A1EF
Feather Star
- 00AED6
≈ Battery Charged Blue
- 9191EF
≈ Perrywinkle
Triadic +120° +240°
- 59A1EF
Feather Star
- E47787
≈ Zany Pink
- 7DAF50
≈ Lost Golfer
Split-complementary +150° +210°
- 59A1EF
Feather Star
- E37E56
≈ Tangerine Flake
- AF9F22
≈ Martian
Tetradic +90° +180° +270°
- 59A1EF
Feather Star
- D679B5
≈ Peruvian Lily
- D18D28
≈ Vibrant Amber
- 34B783
≈ Ming Green
Contrast & accessibility
Ag
FailOn white
WCAG 2.70:1 · APCA Lc 52
Ag
AAAOn black
WCAG 7.76:1 · APCA Lc 50
Best text color: #000000
WCAG 7.76:1 (AAA) · APCA Lc 50
Contrast pairs
Code snippets
CSS
:root {
--feather-star: #59a1ef;
--feather-star-rgb: 89 161 239;
--feather-star-oklch: oklch(0.696 0.136 252);
}
.element {
color: var(--feather-star);
background-color: hsl(211 82% 64%);
border-color: oklch(0.696 0.136 252);
}Tailwind CSS v4
@theme {
--color-feather-star: #59a1ef;
--color-feather-star-50: #dbf8ff;
--color-feather-star-100: #c9ebff;
--color-feather-star-200: #acd8ff;
--color-feather-star-300: #86bbfc;
--color-feather-star-400: #5ea2ec;
--color-feather-star-500: #3689dd;
--color-feather-star-600: #3074ba;
--color-feather-star-700: #265d96;
--color-feather-star-800: #16446f;
--color-feather-star-900: #0e2f4e;
--color-feather-star-950: #021b34;
}SCSS
$feather-star: #59a1ef;
$feather-star-rgb: 89, 161, 239;
$feather-star-light: mix(#fff, $feather-star, 20%);
$feather-star-dark: mix(#000, $feather-star, 20%);
.element {
color: $feather-star;
box-shadow: 0 0 0 2px rgba($feather-star, 0.35);
}