Nazwany kolor · #C3ADC5
Heather Feather
Heather Feather to #C3ADC5: rgb(195 173 197), hsl(295 17% 73%), oklch(0.774 0.042 323.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Heather Feather color name →
#C3ADC5
oklch(0.774 0.042 323.4)
Konwersje koloru
- HEX
- #c3adc5
- RGB
- rgb(195 173 197)
- HSL
- hsl(295 17% 73%)
- HWB
- hwb(295 68% 23%)
- OKLCH
- oklch(0.774 0.042 323.4)
- OKLab
- oklab(0.774 0.033 -0.025)
- CIE Lab
- lab(73.21 11.41 -9.22)
- LCH
- lch(73.21 14.67 321.1)
- CMYK
- cmyk(1% 12% 0% 23%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C9B5CB
- CFBDD0
- D5C5D6
- DBCDDC
- E1D5E2
- E7DEE8
- EDE6ED
- F3EEF3
- F9F7F9
Odcienie ciemniejsze
- A996AB
- 907F92
- 786A79
- 605561
- 4A414B
- 342D35
- 201B21
- 0E0B0E
- 020102
Tony
- BCA8BE
- B5A4B7
- AE9FB0
- A89BA9
- A196A2
- 9A929B
- 948D94
- 8D898D
- 878487
Harmonie kolorów
Komplementarna +180°
- C3ADC5
Heather Feather
- A6BDA5
≈ Bryophyte
Analogowa -30° +30°
- C3ADC5
Heather Feather
- B6B1CE
≈ Petunia Trail
- CCABB7
≈ Scented Frill
Triada +120° +240°
- C3ADC5
Heather Feather
- C2B498
≈ Palisade
- 97BEC1
≈ Bel Esprit
Komplementarna rozszczepiona +150° +210°
- C3ADC5
Heather Feather
- B5B99B
≈ Foille
- 9BBFB3
≈ Diorite
Tetrada +90° +180° +270°
- C3ADC5
Heather Feather
- CCAF9D
≈ Frappé
- A6BDA5
≈ Bryophyte
- 9CBBCC
≈ Partly Cloudy
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.07:1 · APCA Lc 41
Ag
AAANa czerni
WCAG 10.10:1 · APCA Lc 62
Najlepszy kolor tekstu: #000000
WCAG 10.10:1 (AAA) · APCA Lc 62
Contrast pairs
Fragmenty kodu
CSS
:root {
--heather-feather: #c3adc5;
--heather-feather-rgb: 195 173 197;
--heather-feather-oklch: oklch(0.774 0.042 323.4);
}
.element {
color: var(--heather-feather);
background-color: hsl(295 17% 73%);
border-color: oklch(0.774 0.042 323.4);
}Tailwind CSS v4
@theme {
--color-heather-feather: #c3adc5;
--color-heather-feather-50: #fcf1fc;
--color-heather-feather-100: #efe3f0;
--color-heather-feather-200: #decede;
--color-heather-feather-300: #c3b0c3;
--color-heather-feather-400: #ab97ad;
--color-heather-feather-500: #947d96;
--color-heather-feather-600: #7d6a7f;
--color-heather-feather-700: #645566;
--color-heather-feather-800: #493e4b;
--color-heather-feather-900: #332a34;
--color-heather-feather-950: #1e1820;
}SCSS
$heather-feather: #c3adc5;
$heather-feather-rgb: 195, 173, 197;
$heather-feather-light: mix(#fff, $heather-feather, 20%);
$heather-feather-dark: mix(#000, $heather-feather, 20%);
.element {
color: $heather-feather;
box-shadow: 0 0 0 2px rgba($heather-feather, 0.35);
}