Benoemde kleur · #BAA2CE
Lucius Lilac
Lucius Lilac is #BAA2CE: rgb(186 162 206), hsl(273 31% 72%), oklch(0.748 0.067 309.4). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Purple mean? → · Lucius Lilac color name →
#BAA2CE
oklch(0.748 0.067 309.4)
Kleurconversies
- HEX
- #baa2ce
- RGB
- rgb(186 162 206)
- HSL
- hsl(273 31% 72%)
- HWB
- hwb(273 64% 19%)
- OKLCH
- oklch(0.748 0.067 309.4)
- OKLab
- oklab(0.748 0.043 -0.052)
- CIE Lab
- lab(69.87 15.25 -19.21)
- LCH
- lch(69.87 24.53 308.5)
- CMYK
- cmyk(10% 21% 0% 19%)
Tinten · Schaduwen · Tonen
Tinten
- C1ABD3
- C8B4D8
- CEBDDD
- D5C7E2
- DCD0E7
- E3D9EC
- EAE3F0
- F1ECF5
- F8F5FA
Schaduwen
- A18CB3
- 897798
- 72637F
- 5C4F66
- 463C4E
- 322A38
- 1E1923
- 0D0A0F
- 020102
Tonen
- B49FC6
- AE9BBE
- A898B6
- A294AE
- 9D91A6
- 978E9F
- 918A97
- 8B878F
- 868388
Kleurharmonieën
Complementair +180°
- BAA2CE
Lucius Lilac
- A0B689
≈ Green Snow
Analoog -30° +30°
- BAA2CE
Lucius Lilac
- A4A9D8
≈ Childish Wonder
- CB9DBB
≈ Idyllic Pink
Triadisch +120° +240°
- BAA2CE
Lucius Lilac
- CAA67F
≈ Toffee Tan
- 7ABBB6
≈ Polished Aqua
Gesplitst complementair +150° +210°
- BAA2CE
Lucius Lilac
- B7AF7D
≈ Leek Powder
- 88BB9E
≈ Grand Gusto
Tetradisch +90° +180° +270°
- BAA2CE
Lucius Lilac
- D39F8E
≈ Soft Sienna
- A0B689
≈ Green Snow
- 7CB8CB
≈ Tennis Blue
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.29:1 · APCA Lc 45
Ag
AAAOp zwart
WCAG 9.14:1 · APCA Lc 57
Beste tekstkleur: #000000
WCAG 9.14:1 (AAA) · APCA Lc 57
Contrast pairs
Codefragmenten
CSS
:root {
--lucius-lilac: #baa2ce;
--lucius-lilac-rgb: 186 162 206;
--lucius-lilac-oklch: oklch(0.748 0.067 309.4);
}
.element {
color: var(--lucius-lilac);
background-color: hsl(273 31% 72%);
border-color: oklch(0.748 0.067 309.4);
}Tailwind CSS v4
@theme {
--color-lucius-lilac: #baa2ce;
--color-lucius-lilac-50: #fcf0ff;
--color-lucius-lilac-100: #efe2f9;
--color-lucius-lilac-200: #decdea;
--color-lucius-lilac-300: #c3aed1;
--color-lucius-lilac-400: #aa94bd;
--color-lucius-lilac-500: #937aa8;
--color-lucius-lilac-600: #7d678e;
--color-lucius-lilac-700: #645372;
--color-lucius-lilac-800: #493c55;
--color-lucius-lilac-900: #32293b;
--color-lucius-lilac-950: #1e1725;
}SCSS
$lucius-lilac: #baa2ce;
$lucius-lilac-rgb: 186, 162, 206;
$lucius-lilac-light: mix(#fff, $lucius-lilac, 20%);
$lucius-lilac-dark: mix(#000, $lucius-lilac, 20%);
.element {
color: $lucius-lilac;
box-shadow: 0 0 0 2px rgba($lucius-lilac, 0.35);
}