Couleur nommée · #99AAFF
Widowmaker
Widowmaker correspond à #99AAFF : rgb(153 170 255), hsl(230 100% 80%), oklch(0.759 0.124 274.5). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Blue mean? → · Widowmaker color name →
#99AAFF
oklch(0.759 0.124 274.5)
Conversions de couleur
- HEX
- #99aaff
- RGB
- rgb(153 170 255)
- HSL
- hsl(230 100% 80%)
- HWB
- hwb(230 60% 0%)
- OKLCH
- oklch(0.759 0.124 274.5)
- OKLab
- oklab(0.759 0.01 -0.123)
- CIE Lab
- lab(70.85 9.65 -44.65)
- LCH
- lch(70.85 45.68 282.2)
- CMYK
- cmyk(40% 33% 0% 0%)
Teintes · Ombres · Tons
Teintes
- A3B3FF
- ACBBFF
- B6C4FF
- C0CCFF
- CAD5FF
- D5DDFF
- DFE6FF
- EAEEFF
- F4F7FF
Ombres
- 8493DE
- 707DBE
- 5D689E
- 4A5380
- 383F63
- 272D48
- 171B2E
- 080B16
- 010103
Tons
- 96A6F2
- 94A2E5
- 919ED8
- 8F9ACC
- 8C96BF
- 8A91B2
- 878DA6
- 858999
- 82848D
Harmonies de couleurs
Complémentaire +180°
- 99AAFF
Widowmaker
- CAAF4A
≈ Hollywood
Analogue -30° +30°
- 99AAFF
Widowmaker
- 67B8FA
≈ Hello Summer
- C29CF0
≈ Lavender Cream
Triadique +120° +240°
- 99AAFF
Widowmaker
- F4937B
≈ Indian Dance
- 6BC88D
≈ Green Gala
Complémentaire divisée +150° +210°
- 99AAFF
Widowmaker
- E79F56
≈ Pumpkin Pie
- A0BE62
≈ Chinese Money Plant
Tétradique +90° +180° +270°
- 99AAFF
Widowmaker
- F28EA7
≈ Astilbe
- CAAF4A
≈ Hollywood
- 32CABA
≈ Exquisite Turquoise
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.19:1 · APCA Lc 43
Ag
AAASur noir
WCAG 9.54:1 · APCA Lc 59
Meilleure couleur de texte: #000000
WCAG 9.54:1 (AAA) · APCA Lc 59
Contrast pairs
Extraits de code
CSS
:root {
--widowmaker: #99aaff;
--widowmaker-rgb: 153 170 255;
--widowmaker-oklch: oklch(0.759 0.124 274.5);
}
.element {
color: var(--widowmaker);
background-color: hsl(230 100% 80%);
border-color: oklch(0.759 0.124 274.5);
}Tailwind CSS v4
@theme {
--color-widowmaker: #99aaff;
--color-widowmaker-50: #ebf3ff;
--color-widowmaker-100: #dce5ff;
--color-widowmaker-200: #c6d0ff;
--color-widowmaker-300: #a6b2f7;
--color-widowmaker-400: #8898e7;
--color-widowmaker-500: #6e7dd7;
--color-widowmaker-600: #5d6ab6;
--color-widowmaker-700: #4a5592;
--color-widowmaker-800: #343e6d;
--color-widowmaker-900: #232b4d;
--color-widowmaker-950: #121833;
}SCSS
$widowmaker: #99aaff;
$widowmaker-rgb: 153, 170, 255;
$widowmaker-light: mix(#fff, $widowmaker, 20%);
$widowmaker-dark: mix(#000, $widowmaker, 20%);
.element {
color: $widowmaker;
box-shadow: 0 0 0 2px rgba($widowmaker, 0.35);
}