Nazwany kolor · #BABBB3
Weathered Moss
Weathered Moss to #BABBB3: rgb(186 187 179), hsl(67 6% 72%), oklch(0.789 0.011 112.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Weathered Moss color name →
#BABBB3
oklch(0.789 0.011 112.4)
Konwersje koloru
- HEX
- #babbb3
- RGB
- rgb(186 187 179)
- HSL
- hsl(67 6% 72%)
- HWB
- hwb(67 70% 27%)
- OKLCH
- oklch(0.789 0.011 112.4)
- OKLab
- oklab(0.789 -0.004 0.01)
- CIE Lab
- lab(75.63 -1.45 3.94)
- LCH
- lch(75.63 4.19 110.2)
- CMYK
- cmyk(1% 0% 4% 27%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C1C2BA
- C7C8C2
- CECFC9
- D5D6D1
- DCDDD8
- E3E3E0
- EAEAE8
- F1F1EF
- F8F8F7
Odcienie ciemniejsze
- A1A29B
- 898A84
- 72736E
- 5C5C58
- 464643
- 32322F
- 1E1F1D
- 0D0D0C
- 020201
Tony
- B4B5AE
- AEAFA9
- A8A9A3
- A2A39E
- 9D9D99
- 979794
- 91918F
- 8B8B8A
- 868685
Harmonie kolorów
Komplementarna +180°
- BABBB3
Weathered Moss
- BAB9C1
≈ Titanium Man
Analogowa -30° +30°
- BABBB3
Weathered Moss
- BEBAB2
≈ Viaduct
- B6BCB6
≈ Quiet Time
Triada +120° +240°
- BABBB3
Weathered Moss
- B3BCC0
≈ Crestline
- C0B7BB
≈ Frisky Whiskers
Komplementarna rozszczepiona +150° +210°
- BABBB3
Weathered Moss
- B6BAC2
≈ Streamlined Grey
- BEB8BE
≈ Standing Ovation
Tetrada +90° +180° +270°
- BABBB3
Weathered Moss
- B2BCBD
≈ Crestline
- BAB9C1
≈ Titanium Man
- C1B8B7
≈ Mountain Boulder
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.93:1 · APCA Lc 37
Ag
AAANa czerni
WCAG 10.84:1 · APCA Lc 65
Najlepszy kolor tekstu: #000000
WCAG 10.84:1 (AAA) · APCA Lc 65
Contrast pairs
Fragmenty kodu
CSS
:root {
--weathered-moss: #babbb3;
--weathered-moss-rgb: 186 187 179;
--weathered-moss-oklch: oklch(0.789 0.011 112.4);
}
.element {
color: var(--weathered-moss);
background-color: hsl(67 6% 72%);
border-color: oklch(0.789 0.011 112.4);
}Tailwind CSS v4
@theme {
--color-weathered-moss: #babbb3;
--color-weathered-moss-50: #f5f5f2;
--color-weathered-moss-100: #e8e8e4;
--color-weathered-moss-200: #d4d5cf;
--color-weathered-moss-300: #b7b8b2;
--color-weathered-moss-400: #9e9f98;
--color-weathered-moss-500: #86877f;
--color-weathered-moss-600: #71726b;
--color-weathered-moss-700: #5b5b56;
--color-weathered-moss-800: #42433e;
--color-weathered-moss-900: #2e2e2b;
--color-weathered-moss-950: #1b1b18;
}SCSS
$weathered-moss: #babbb3;
$weathered-moss-rgb: 186, 187, 179;
$weathered-moss-light: mix(#fff, $weathered-moss, 20%);
$weathered-moss-dark: mix(#000, $weathered-moss, 20%);
.element {
color: $weathered-moss;
box-shadow: 0 0 0 2px rgba($weathered-moss, 0.35);
}