Cor nomeada mais próxima · #A648A2
#A648A2
Cor nomeada mais próxima: Vicious Violet
#A648A2 (rgb(166 72 162), hsl(303 39% 47%), oklch(0.557 0.166 329.2)) é mais próxima da cor nomeada Vicious Violet. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#A648A2
oklch(0.557 0.166 329.2)
Conversões de cor
- HEX
- #a648a2
- RGB
- rgb(166 72 162)
- HSL
- hsl(303 39% 47%)
- HWB
- hwb(303 28% 35%)
- OKLCH
- oklch(0.557 0.166 329.2)
- OKLab
- oklab(0.557 0.143 -0.085)
- CIE Lab
- lab(46.07 48.25 -30.74)
- LCH
- lch(46.07 57.21 327.5)
- CMYK
- cmyk(0% 57% 2% 35%)
Tons claros · Sombras · Tons
Tons claros
- B05BAC
- BA6EB5
- C380BE
- CC92C8
- D5A4D1
- DEB6DA
- E7C8E4
- EFDAED
- F7EDF6
Sombras
- 903D8C
- 7A3377
- 652963
- 511F4F
- 3E163C
- 2B0D2A
- 1A0619
- 0A020A
- 010001
Tons
- A34F9F
- A0569C
- 9C5C99
- 996295
- 956892
- 926D8F
- 8E728B
- 897787
- 857B84
Harmonias de cor
Complementar +180°
- A648A2
Vicious Violet
- 008B3B
≈ Cold Green
Análoga -30° +30°
- A648A2
Vicious Violet
- 8357C5
≈ Fuchsia Blue
- BB3E71
≈ Lilac Rose
Tríade +120° +240°
- A648A2
Vicious Violet
- 8E6F00
≈ Vermin Brown
- 008292
≈ Island Lush
Complementar dividida +150° +210°
- A648A2
Vicious Violet
- 6B7D00
≈ Topiary Garden
- 008675
≈ Summer Turquoise
Tétrade +90° +180° +270°
- A648A2
Vicious Violet
- AA5D00
≈ Raw Umber
- 008B3B
≈ Cold Green
- 007CB5
≈ Artesian Water
Contraste e acessibilidade
Ag
AASobre branco
WCAG 5.15:1 · APCA Lc 75
Ag
FailSobre preto
WCAG 4.07:1 · APCA Lc 27
Melhor cor de texto: #FFFFFF
WCAG 5.15:1 (AA) · APCA Lc 75
Contrast pairs
Trechos de código
CSS
:root {
--vicious-violet: #a648a2;
--vicious-violet-rgb: 166 72 162;
--vicious-violet-oklch: oklch(0.557 0.166 329.2);
}
.element {
color: var(--vicious-violet);
background-color: hsl(303 39% 47%);
border-color: oklch(0.557 0.166 329.2);
}Tailwind CSS v4
@theme {
--color-vicious-violet: #a648a2;
--color-vicious-violet-50: #ffe4ff;
--color-vicious-violet-100: #ffd4ff;
--color-vicious-violet-200: #febaf5;
--color-vicious-violet-300: #e897de;
--color-vicious-violet-400: #d377ce;
--color-vicious-violet-500: #bf55bb;
--color-vicious-violet-600: #a2499e;
--color-vicious-violet-700: #823a7f;
--color-vicious-violet-800: #5f2a60;
--color-vicious-violet-900: #431c43;
--color-vicious-violet-950: #2b0c2b;
}SCSS
$vicious-violet: #a648a2;
$vicious-violet-rgb: 166, 72, 162;
$vicious-violet-light: mix(#fff, $vicious-violet, 20%);
$vicious-violet-dark: mix(#000, $vicious-violet, 20%);
.element {
color: $vicious-violet;
box-shadow: 0 0 0 2px rgba($vicious-violet, 0.35);
}