Nazwany kolor · #BAA2CE
Lucius Lilac
Lucius Lilac to #BAA2CE: rgb(186 162 206), hsl(273 31% 72%), oklch(0.748 0.067 309.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Lucius Lilac color name →
#BAA2CE
oklch(0.748 0.067 309.4)
Konwersje koloru
- 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%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C1ABD3
- C8B4D8
- CEBDDD
- D5C7E2
- DCD0E7
- E3D9EC
- EAE3F0
- F1ECF5
- F8F5FA
Odcienie ciemniejsze
- A18CB3
- 897798
- 72637F
- 5C4F66
- 463C4E
- 322A38
- 1E1923
- 0D0A0F
- 020102
Tony
- B49FC6
- AE9BBE
- A898B6
- A294AE
- 9D91A6
- 978E9F
- 918A97
- 8B878F
- 868388
Harmonie kolorów
Komplementarna +180°
- BAA2CE
Lucius Lilac
- A0B689
≈ Green Snow
Analogowa -30° +30°
- BAA2CE
Lucius Lilac
- A4A9D8
≈ Childish Wonder
- CB9DBB
≈ Idyllic Pink
Triada +120° +240°
- BAA2CE
Lucius Lilac
- CAA67F
≈ Toffee Tan
- 7ABBB6
≈ Polished Aqua
Komplementarna rozszczepiona +150° +210°
- BAA2CE
Lucius Lilac
- B7AF7D
≈ Leek Powder
- 88BB9E
≈ Grand Gusto
Tetrada +90° +180° +270°
- BAA2CE
Lucius Lilac
- D39F8E
≈ Soft Sienna
- A0B689
≈ Green Snow
- 7CB8CB
≈ Tennis Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.29:1 · APCA Lc 45
Ag
AAANa czerni
WCAG 9.14:1 · APCA Lc 57
Najlepszy kolor tekstu: #000000
WCAG 9.14:1 (AAA) · APCA Lc 57
Contrast pairs
Fragmenty kodu
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);
}