Benoemde kleur · #5577EE
Blue Öyster Cult
Blue Öyster Cult is #5577EE: rgb(85 119 238), hsl(227 82% 63%), oklch(0.606 0.183 268.5). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Blue mean? → · Blue Öyster Cult color name →
#5577EE
oklch(0.606 0.183 268.5)
Kleurconversies
- HEX
- #5577ee
- RGB
- rgb(85 119 238)
- HSL
- hsl(227 82% 63%)
- HWB
- hwb(227 33% 7%)
- OKLCH
- oklch(0.606 0.183 268.5)
- OKLab
- oklab(0.606 -0.005 -0.183)
- CIE Lab
- lab(52.32 16.94 -64.98)
- LCH
- lch(52.32 67.15 284.6)
- CMYK
- cmyk(64% 50% 0% 7%)
Tinten · Schaduwen · Tonen
Tinten
- 6486F1
- 7494F4
- 84A2F6
- 95AFF9
- A6BDFB
- B7CAFC
- C9D8FD
- DBE5FE
- EDF2FF
Schaduwen
- 4967CF
- 3D57B1
- 314793
- 263877
- 1C2A5C
- 111C42
- 08102A
- 020514
- 000103
Tonen
- 5979E3
- 5D7BD9
- 617DCE
- 667EC3
- 6A7FB8
- 6E7FAD
- 7380A2
- 778097
- 7C808C
Kleurharmonieën
Complementair +180°
- 5577EE
Blue Öyster Cult
- A07D00
≈ Hornet Yellow
Analoog -30° +30°
- 5577EE
Blue Öyster Cult
- 008BC9
≈ Newport Blue
- 9263DF
≈ Legendary Lavender
Triadisch +120° +240°
- 5577EE
Blue Öyster Cult
- DA493D
≈ Matt Demon
- 009D40
≈ Gangly Gremlin
Gesplitst complementair +150° +210°
- 5577EE
Blue Öyster Cult
- C06800
≈ Hawaiian Sunset
- 7A8D00
≈ Canopy
Tetradisch +90° +180° +270°
- 5577EE
Blue Öyster Cult
- D24681
≈ Jaipur Pink
- A07D00
≈ Hornet Yellow
- 009783
≈ Approval Green
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 3.99:1 · APCA Lc 67
Ag
AAOp zwart
WCAG 5.25:1 · APCA Lc 35
Beste tekstkleur: #000000
WCAG 5.25:1 (AA) · APCA Lc 35
Contrast pairs
Codefragmenten
CSS
:root {
--blue-oyster-cult: #5577ee;
--blue-oyster-cult-rgb: 85 119 238;
--blue-oyster-cult-oklch: oklch(0.606 0.183 268.5);
}
.element {
color: var(--blue-oyster-cult);
background-color: hsl(227 82% 63%);
border-color: oklch(0.606 0.183 268.5);
}Tailwind CSS v4
@theme {
--color-blue-oyster-cult: #5577ee;
--color-blue-oyster-cult-50: #e1f3ff;
--color-blue-oyster-cult-100: #d0e6ff;
--color-blue-oyster-cult-200: #b6d0ff;
--color-blue-oyster-cult-300: #94b1ff;
--color-blue-oyster-cult-400: #7296ff;
--color-blue-oyster-cult-500: #5579fd;
--color-blue-oyster-cult-600: #4867d5;
--color-blue-oyster-cult-700: #3952ac;
--color-blue-oyster-cult-800: #253c81;
--color-blue-oyster-cult-900: #182a5b;
--color-blue-oyster-cult-950: #0a173e;
}SCSS
$blue-oyster-cult: #5577ee;
$blue-oyster-cult-rgb: 85, 119, 238;
$blue-oyster-cult-light: mix(#fff, $blue-oyster-cult, 20%);
$blue-oyster-cult-dark: mix(#000, $blue-oyster-cult, 20%);
.element {
color: $blue-oyster-cult;
box-shadow: 0 0 0 2px rgba($blue-oyster-cult, 0.35);
}