Nazwany kolor · #A8A3B1
Luxe Lilac
Luxe Lilac to #A8A3B1: rgb(168 163 177), hsl(261 8% 67%), oklch(0.724 0.021 302.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Luxe Lilac color name →
#A8A3B1
oklch(0.724 0.021 302.1)
Konwersje koloru
- HEX
- #a8a3b1
- RGB
- rgb(168 163 177)
- HSL
- hsl(261 8% 67%)
- HWB
- hwb(261 64% 31%)
- OKLCH
- oklch(0.724 0.021 302.1)
- OKLab
- oklab(0.724 0.011 -0.018)
- CIE Lab
- lab(67.75 3.88 -6.59)
- LCH
- lch(67.75 7.64 300.5)
- CMYK
- cmyk(5% 8% 0% 31%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B0ACB9
- B9B5C0
- C1BEC8
- CAC7D0
- D3D0D7
- DBD9DF
- E4E3E7
- EDECEF
- F6F5F7
Odcienie ciemniejsze
- 928D99
- 7C7883
- 67636C
- 524F57
- 3F3C42
- 2C2A2F
- 1A191C
- 0A0A0C
- 010101
Tony
- A49FAC
- A09CA7
- 9C98A2
- 98959D
- 949198
- 908E93
- 8C8A8E
- 88878A
- 848385
Harmonie kolorów
Komplementarna +180°
- A8A3B1
Luxe Lilac
- A3A89A
≈ Garden Promenade
Analogowa -30° +30°
- A8A3B1
Luxe Lilac
- A1A5B3
≈ Great Falls
- AEA1AC
≈ Symbolic
Triada +120° +240°
- A8A3B1
Luxe Lilac
- B0A399
≈ Moleskin
- 98AAA7
≈ Oily Steel
Komplementarna rozszczepiona +150° +210°
- A8A3B1
Luxe Lilac
- AAA698
≈ Tornado Watch
- 9DAAA0
≈ Halcyon Green
Tetrada +90° +180° +270°
- A8A3B1
Luxe Lilac
- B2A19E
≈ Dusky Hyacinth
- A3A89A
≈ Garden Promenade
- 98AAAD
≈ Nor’wester
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.45:1 · APCA Lc 48
Ag
AAANa czerni
WCAG 8.53:1 · APCA Lc 54
Najlepszy kolor tekstu: #000000
WCAG 8.53:1 (AAA) · APCA Lc 54
Contrast pairs
Fragmenty kodu
CSS
:root {
--luxe-lilac: #a8a3b1;
--luxe-lilac-rgb: 168 163 177;
--luxe-lilac-oklch: oklch(0.724 0.021 302.1);
}
.element {
color: var(--luxe-lilac);
background-color: hsl(261 8% 67%);
border-color: oklch(0.724 0.021 302.1);
}Tailwind CSS v4
@theme {
--color-luxe-lilac: #a8a3b1;
--color-luxe-lilac-50: #f6f4fa;
--color-luxe-lilac-100: #e9e6ee;
--color-luxe-lilac-200: #d6d2dc;
--color-luxe-lilac-300: #b9b5c0;
--color-luxe-lilac-400: #a09ca9;
--color-luxe-lilac-500: #888392;
--color-luxe-lilac-600: #736f7b;
--color-luxe-lilac-700: #5c5963;
--color-luxe-lilac-800: #434149;
--color-luxe-lilac-900: #2e2d32;
--color-luxe-lilac-950: #1b1a1e;
}SCSS
$luxe-lilac: #a8a3b1;
$luxe-lilac-rgb: 168, 163, 177;
$luxe-lilac-light: mix(#fff, $luxe-lilac, 20%);
$luxe-lilac-dark: mix(#000, $luxe-lilac, 20%);
.element {
color: $luxe-lilac;
box-shadow: 0 0 0 2px rgba($luxe-lilac, 0.35);
}