Cor nomeada · #764F80
Spiced Plum
Spiced Plum é #764F80: rgb(118 79 128), hsl(288 24% 41%), oklch(0.489 0.089 319.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Purple mean? → · Spiced Plum color name →
#764F80
oklch(0.489 0.089 319.3)
Conversões de cor
- HEX
- #764f80
- RGB
- rgb(118 79 128)
- HSL
- hsl(288 24% 41%)
- HWB
- hwb(288 31% 50%)
- OKLCH
- oklch(0.489 0.089 319.3)
- OKLab
- oklab(0.489 0.067 -0.058)
- CIE Lab
- lab(39.49 23.62 -21.11)
- LCH
- lch(39.49 31.68 318.2)
- CMYK
- cmyk(8% 38% 0% 50%)
Tons claros · Sombras · Tons
Tons claros
- 835F8C
- 907099
- 9E81A5
- AB92B2
- B9A4BE
- C7B5CB
- D5C7D8
- E3DAE5
- F1ECF2
Sombras
- 66446E
- 56385D
- 472E4D
- 38233D
- 29192E
- 1C101F
- 0F0712
- 050206
- 010001
Tons
- 775480
- 785980
- 7A5E81
- 7B6381
- 7C6881
- 7D6D81
- 7E7281
- 7E7680
- 7F7B80
Harmonias de cor
Complementar +180°
- 764F80
Spiced Plum
- 456C3A
≈ Gully Green
Análoga -30° +30°
- 764F80
Spiced Plum
- 5F578F
≈ Fine Purple
- 854A68
≈ Noble Tone
Tríade +120° +240°
- 764F80
Spiced Plum
- 7B5A1B
≈ Qahvei Brown
- 006E72
≈ Active Turquoise
Complementar dividida +150° +210°
- 764F80
Spiced Plum
- 646420
≈ Greenish Brown
- 197058
≈ Precious Emerald
Tétrade +90° +180° +270°
- 764F80
Spiced Plum
- 885030
≈ Charred Clay
- 456C3A
≈ Gully Green
- 176988
≈ Sea Goddess
Contraste e acessibilidade
Ag
AASobre branco
WCAG 6.56:1 · APCA Lc 82
Ag
FailSobre preto
WCAG 3.20:1 · APCA Lc 20
Melhor cor de texto: #FFFFFF
WCAG 6.56:1 (AA) · APCA Lc 82
Contrast pairs
Trechos de código
CSS
:root {
--spiced-plum: #764f80;
--spiced-plum-rgb: 118 79 128;
--spiced-plum-oklch: oklch(0.489 0.089 319.3);
}
.element {
color: var(--spiced-plum);
background-color: hsl(288 24% 41%);
border-color: oklch(0.489 0.089 319.3);
}Tailwind CSS v4
@theme {
--color-spiced-plum: #764f80;
--color-spiced-plum-50: #ffedff;
--color-spiced-plum-100: #f6dffa;
--color-spiced-plum-200: #e6c8ec;
--color-spiced-plum-300: #cda9d3;
--color-spiced-plum-400: #b68ec0;
--color-spiced-plum-500: #a073ab;
--color-spiced-plum-600: #876191;
--color-spiced-plum-700: #6c4e74;
--color-spiced-plum-800: #4f3857;
--color-spiced-plum-900: #37273d;
--color-spiced-plum-950: #221526;
}SCSS
$spiced-plum: #764f80;
$spiced-plum-rgb: 118, 79, 128;
$spiced-plum-light: mix(#fff, $spiced-plum, 20%);
$spiced-plum-dark: mix(#000, $spiced-plum, 20%);
.element {
color: $spiced-plum;
box-shadow: 0 0 0 2px rgba($spiced-plum, 0.35);
}