Cor nomeada mais próxima · #8764C2
#8764C2
Cor nomeada mais próxima: Lavish Spending
#8764C2 (rgb(135 100 194), hsl(262 44% 58%), oklch(0.58 0.143 299.1)) é mais próxima da cor nomeada Lavish Spending. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#8764C2
oklch(0.58 0.143 299.1)
Conversões de cor
- HEX
- #8764c2
- RGB
- rgb(135 100 194)
- HSL
- hsl(262 44% 58%)
- HWB
- hwb(262 39% 24%)
- OKLCH
- oklch(0.58 0.143 299.1)
- OKLab
- oklab(0.58 0.069 -0.125)
- CIE Lab
- lab(49.25 29.7 -44.75)
- LCH
- lch(49.25 53.7 303.6)
- CMYK
- cmyk(30% 48% 0% 24%)
Tons claros · Sombras · Tons
Tons claros
- 9274C9
- 9D83D0
- A992D6
- B5A2DC
- C1B1E3
- CDC0E9
- D9D0EF
- E6E0F4
- F2EFFA
Sombras
- 7556A8
- 63488F
- 513B77
- 412E60
- 312249
- 211634
- 130B20
- 06030E
- 010002
Tons
- 8668BC
- 856BB5
- 846EAF
- 8471A9
- 8374A2
- 82779C
- 827995
- 817C8E
- 817E87
Harmonias de cor
Complementar +180°
- 8764C2
Lavish Spending
- 728500
≈ Swamp Green
Análoga -30° +30°
- 8764C2
Lavish Spending
- 5873CE
≈ Indigo Light
- A758A3
≈ Orchid Dottyback
Tríade +120° +240°
- 8764C2
Lavish Spending
- B46200
≈ Umber
- 008E7C
≈ Philips Green
Complementar dividida +150° +210°
- 8764C2
Lavish Spending
- 977600
≈ Mesozoic Green
- 2A9148
≈ Paperboy’s Lawn
Tétrade +90° +180° +270°
- 8764C2
Lavish Spending
- C05346
≈ Sunset
- 728500
≈ Swamp Green
- 008A9A
≈ Atlantic Blue
Contraste e acessibilidade
Ag
AASobre branco
WCAG 4.53:1 · APCA Lc 71
Ag
AASobre preto
WCAG 4.63:1 · APCA Lc 30
Melhor cor de texto: #000000
WCAG 4.63:1 (AA) · APCA Lc 30
Contrast pairs
Trechos de código
CSS
:root {
--lavish-spending: #8764c2;
--lavish-spending-rgb: 135 100 194;
--lavish-spending-oklch: oklch(0.58 0.143 299.1);
}
.element {
color: var(--lavish-spending);
background-color: hsl(262 44% 58%);
border-color: oklch(0.58 0.143 299.1);
}Tailwind CSS v4
@theme {
--color-lavish-spending: #8764c2;
--color-lavish-spending-50: #fcecff;
--color-lavish-spending-100: #f0deff;
--color-lavish-spending-200: #dec7ff;
--color-lavish-spending-300: #c4a6f5;
--color-lavish-spending-400: #aa8ae6;
--color-lavish-spending-500: #946dd6;
--color-lavish-spending-600: #7d5db5;
--color-lavish-spending-700: #644a91;
--color-lavish-spending-800: #48366d;
--color-lavish-spending-900: #32254d;
--color-lavish-spending-950: #1e1333;
}SCSS
$lavish-spending: #8764c2;
$lavish-spending-rgb: 135, 100, 194;
$lavish-spending-light: mix(#fff, $lavish-spending, 20%);
$lavish-spending-dark: mix(#000, $lavish-spending, 20%);
.element {
color: $lavish-spending;
box-shadow: 0 0 0 2px rgba($lavish-spending, 0.35);
}