Cor nomeada mais próxima · #AB8298
#AB8298
Cor nomeada mais próxima: Voila!
#AB8298 (rgb(171 130 152), hsl(328 20% 59%), oklch(0.653 0.059 345.4)) é mais próxima da cor nomeada Voila!. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#AB8298
oklch(0.653 0.059 345.4)
Conversões de cor
- HEX
- #ab8298
- RGB
- rgb(171 130 152)
- HSL
- hsl(328 20% 59%)
- HWB
- hwb(328 51% 33%)
- OKLCH
- oklch(0.653 0.059 345.4)
- OKLab
- oklab(0.653 0.057 -0.015)
- CIE Lab
- lab(58.94 18.93 -5.4)
- LCH
- lch(58.94 19.68 344.1)
- CMYK
- cmyk(0% 24% 11% 33%)
Tons claros · Sombras · Tons
Tons claros
- B38EA2
- BC9AAC
- C4A6B6
- CDB3C0
- D5BFCA
- DECCD5
- E6D8DF
- EEE5EA
- F7F2F4
Sombras
- 947084
- 7E5F70
- 684E5C
- 543E4A
- 402F38
- 2D2027
- 1B1217
- 0B0608
- 010101
Tons
- A78296
- A38293
- 9E8291
- 9A818E
- 96818C
- 92818A
- 8D8187
- 898185
- 848082
Harmonias de cor
Complementar +180°
- AB8298
Voila!
- 6E9C87
≈ Peahen
Análoga -30° +30°
- AB8298
Voila!
- 9E86A9
≈ Wonder Violet
- B18284
≈ Retro Pink
Tríade +120° +240°
- AB8298
Voila!
- 959369
≈ Hula Girl
- 6998AB
≈ Cloudy Sea
Complementar dividida +150° +210°
- AB8298
Voila!
- 819975
≈ Eat Your Peas
- 649C9B
≈ Semi-Precious
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 3.29:1 · APCA Lc 60
Ag
AASobre preto
WCAG 6.37:1 · APCA Lc 41
Melhor cor de texto: #000000
WCAG 6.37:1 (AA) · APCA Lc 41
Contrast pairs
Trechos de código
CSS
:root {
--voila: #ab8298;
--voila-rgb: 171 130 152;
--voila-oklch: oklch(0.653 0.059 345.4);
}
.element {
color: var(--voila);
background-color: hsl(328 20% 59%);
border-color: oklch(0.653 0.059 345.4);
}Tailwind CSS v4
@theme {
--color-voila: #ab8298;
--color-voila-50: #ffeff8;
--color-voila-100: #f8e0eb;
--color-voila-200: #e8cbd9;
--color-voila-300: #cfacbd;
--color-voila-400: #b991a6;
--color-voila-500: #a3778f;
--color-voila-600: #8a6579;
--color-voila-700: #6e5061;
--color-voila-800: #513a48;
--color-voila-900: #392832;
--color-voila-950: #23161e;
}SCSS
$voila: #ab8298;
$voila-rgb: 171, 130, 152;
$voila-light: mix(#fff, $voila, 20%);
$voila-dark: mix(#000, $voila, 20%);
.element {
color: $voila;
box-shadow: 0 0 0 2px rgba($voila, 0.35);
}