Nazwany kolor · #BDADA4
Thumper
Thumper to #BDADA4: rgb(189 173 164), hsl(22 16% 69%), oklch(0.759 0.023 51.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Thumper color name →
#BDADA4
oklch(0.759 0.023 51.4)
Konwersje koloru
- HEX
- #bdada4
- RGB
- rgb(189 173 164)
- HSL
- hsl(22 16% 69%)
- HWB
- hwb(22 64% 26%)
- OKLCH
- oklch(0.759 0.023 51.4)
- OKLab
- oklab(0.759 0.014 0.018)
- CIE Lab
- lab(71.91 4.82 6.83)
- LCH
- lch(71.91 8.36 54.8)
- CMYK
- cmyk(0% 8% 13% 26%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C3B5AD
- CABDB6
- D1C5BF
- D7CDC8
- DED5D1
- E4DEDA
- EBE6E3
- F2EEEC
- F8F7F6
Odcienie ciemniejsze
- A4968E
- 8C7F79
- 746A64
- 5D5550
- 47413D
- 332D2B
- 1F1B1A
- 0D0B0A
- 020101
Tony
- B7A8A0
- B1A49D
- AA9F99
- A49B95
- 9E9692
- 98928E
- 928D8B
- 8C8987
- 868484
Harmonie kolorów
Komplementarna +180°
- BDADA4
Thumper
- A3B4BD
≈ Shark Loop
Analogowa -30° +30°
- BDADA4
Thumper
- BFABAA
≈ Dusky
- B8B0A1
≈ Camping Tent
Triada +120° +240°
- BDADA4
Thumper
- A3B6AF
≈ Smokey Slate
- B0AEBE
≈ Wisteria Trellis
Komplementarna rozszczepiona +150° +210°
- BDADA4
Thumper
- A1B5B7
≈ Marine Layer
- A9B1BF
≈ Grey Agate
Tetrada +90° +180° +270°
- BDADA4
Thumper
- A9B4A7
≈ Forever Green
- A3B4BD
≈ Shark Loop
- B8ACB9
≈ Lola
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.17:1 · APCA Lc 43
Ag
AAANa czerni
WCAG 9.67:1 · APCA Lc 60
Najlepszy kolor tekstu: #000000
WCAG 9.67:1 (AAA) · APCA Lc 60
Contrast pairs
Fragmenty kodu
CSS
:root {
--thumper: #bdada4;
--thumper-rgb: 189 173 164;
--thumper-oklch: oklch(0.759 0.023 51.4);
}
.element {
color: var(--thumper);
background-color: hsl(22 16% 69%);
border-color: oklch(0.759 0.023 51.4);
}Tailwind CSS v4
@theme {
--color-thumper: #bdada4;
--color-thumper-50: #fbf4ef;
--color-thumper-100: #eee6e1;
--color-thumper-200: #dcd2cb;
--color-thumper-300: #c1b5ad;
--color-thumper-400: #aa9b93;
--color-thumper-500: #938279;
--color-thumper-600: #7c6e66;
--color-thumper-700: #635852;
--color-thumper-800: #49403c;
--color-thumper-900: #332c29;
--color-thumper-950: #1e1917;
}SCSS
$thumper: #bdada4;
$thumper-rgb: 189, 173, 164;
$thumper-light: mix(#fff, $thumper, 20%);
$thumper-dark: mix(#000, $thumper, 20%);
.element {
color: $thumper;
box-shadow: 0 0 0 2px rgba($thumper, 0.35);
}