Nazwany kolor · #AFABB8
Lilac Bloom
Lilac Bloom to #AFABB8: rgb(175 171 184), hsl(258 8% 70%), oklch(0.749 0.019 300). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Lilac Bloom color name →
#AFABB8
oklch(0.749 0.019 300)
Konwersje koloru
- HEX
- #afabb8
- RGB
- rgb(175 171 184)
- HSL
- hsl(258 8% 70%)
- HWB
- hwb(258 67% 28%)
- OKLCH
- oklch(0.749 0.019 300)
- OKLab
- oklab(0.749 0.009 -0.016)
- CIE Lab
- lab(70.62 3.33 -6.15)
- LCH
- lch(70.62 7 298.5)
- CMYK
- cmyk(5% 7% 0% 28%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B7B3BF
- BFBBC6
- C6C4CD
- CECCD4
- D6D4DB
- DEDDE2
- E6E5E9
- EFEEF0
- F7F6F8
Odcienie ciemniejsze
- 9894A0
- 817E88
- 6B6871
- 56545B
- 414045
- 2E2D31
- 1C1B1E
- 0B0B0C
- 010102
Tony
- AAA7B2
- A5A2AD
- A19EA7
- 9C9AA1
- 97959C
- 929196
- 8E8D90
- 89888B
- 858485
Harmonie kolorów
Komplementarna +180°
- AFABB8
Lilac Bloom
- ACAFA2
≈ Smoky White
Analogowa -30° +30°
- AFABB8
Lilac Bloom
- A9ADBA
≈ Berry Chalk
- B5A9B3
≈ Resplendent
Triada +120° +240°
- AFABB8
Lilac Bloom
- B7ABA2
≈ Barren
- A1B2AE
≈ Conch
Komplementarna rozszczepiona +150° +210°
- AFABB8
Lilac Bloom
- B2ADA0
≈ Roman Wall
- A5B1A7
≈ Dreamcatcher
Tetrada +90° +180° +270°
- AFABB8
Lilac Bloom
- B9A9A6
≈ Winter Cocoa
- ACAFA2
≈ Smoky White
- A1B1B4
≈ Ovation
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.24:1 · APCA Lc 44
Ag
AAANa czerni
WCAG 9.34:1 · APCA Lc 58
Najlepszy kolor tekstu: #000000
WCAG 9.34:1 (AAA) · APCA Lc 58
Contrast pairs
Fragmenty kodu
CSS
:root {
--lilac-bloom: #afabb8;
--lilac-bloom-rgb: 175 171 184;
--lilac-bloom-oklch: oklch(0.749 0.019 300);
}
.element {
color: var(--lilac-bloom);
background-color: hsl(258 8% 70%);
border-color: oklch(0.749 0.019 300);
}Tailwind CSS v4
@theme {
--color-lilac-bloom: #afabb8;
--color-lilac-bloom-50: #f6f4fa;
--color-lilac-bloom-100: #e9e6ed;
--color-lilac-bloom-200: #d5d2db;
--color-lilac-bloom-300: #b9b5c0;
--color-lilac-bloom-400: #a09ca8;
--color-lilac-bloom-500: #888491;
--color-lilac-bloom-600: #736f7b;
--color-lilac-bloom-700: #5c5962;
--color-lilac-bloom-800: #434148;
--color-lilac-bloom-900: #2e2d32;
--color-lilac-bloom-950: #1b1a1e;
}SCSS
$lilac-bloom: #afabb8;
$lilac-bloom-rgb: 175, 171, 184;
$lilac-bloom-light: mix(#fff, $lilac-bloom, 20%);
$lilac-bloom-dark: mix(#000, $lilac-bloom, 20%);
.element {
color: $lilac-bloom;
box-shadow: 0 0 0 2px rgba($lilac-bloom, 0.35);
}