Adlandırılmış renk · #8B8C83
Naturalist Grey
Naturalist Grey, #8B8C83: rgb(139 140 131), hsl(67 4% 53%), oklch(0.637 0.013 111.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Naturalist Grey color name →
#8B8C83
oklch(0.637 0.013 111.9)
Renk dönüşümleri
- HEX
- #8b8c83
- RGB
- rgb(139 140 131)
- HSL
- hsl(67 4% 53%)
- HWB
- hwb(67 51% 45%)
- OKLCH
- oklch(0.637 0.013 111.9)
- OKLab
- oklab(0.637 -0.005 0.012)
- CIE Lab
- lab(57.96 -1.66 4.69)
- LCH
- lch(57.96 4.98 109.5)
- CMYK
- cmyk(1% 0% 6% 45%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 96978F
- A1A29B
- ACADA7
- B8B8B3
- C3C4BF
- CFD0CC
- DBDBD8
- E7E7E5
- F3F3F2
Koyu tonlar
- 787971
- 666760
- 54554F
- 43433F
- 32332F
- 232320
- 141412
- 070706
- 010101
Gri tonlar
- 8A8B83
- 898A82
- 888882
- 878782
- 858682
- 848581
- 838481
- 828281
- 818180
Renk uyumları
Tamamlayıcı +180°
- 8B8C83
Naturalist Grey
- 8B8A93
≈ Sleet
Analog -30° +30°
- 8B8C83
Naturalist Grey
- 8F8A82
≈ Dovetail
- 878D86
≈ Valley Floor
Üçlü +120° +240°
- 8B8C83
Naturalist Grey
- 848D92
≈ Oslo Grey
- 92888C
≈ Stone Haze
Bölünmüş tamamlayıcı +150° +210°
- 8B8C83
Naturalist Grey
- 878B93
≈ Nuts and Bolts
- 8F8990
≈ Gris Morado
Dörtlü +90° +180° +270°
- 8B8C83
Naturalist Grey
- 828E8E
≈ Harrow’s Gate
- 8B8A93
≈ Sleet
- 938887
≈ Storm Break
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.39:1 · APCA Lc 62
Ag
AASiyah üzerinde
WCAG 6.17:1 · APCA Lc 40
En iyi metin rengi: #000000
WCAG 6.17:1 (AA) · APCA Lc 40
Contrast pairs
Kod parçacıkları
CSS
:root {
--naturalist-grey: #8b8c83;
--naturalist-grey-rgb: 139 140 131;
--naturalist-grey-oklch: oklch(0.637 0.013 111.9);
}
.element {
color: var(--naturalist-grey);
background-color: hsl(67 4% 53%);
border-color: oklch(0.637 0.013 111.9);
}Tailwind CSS v4
@theme {
--color-naturalist-grey: #8b8c83;
--color-naturalist-grey-50: #f5f6f1;
--color-naturalist-grey-100: #e8e8e3;
--color-naturalist-grey-200: #d4d5cf;
--color-naturalist-grey-300: #b7b8b1;
--color-naturalist-grey-400: #9e9f97;
--color-naturalist-grey-500: #86877d;
--color-naturalist-grey-600: #71726a;
--color-naturalist-grey-700: #5b5b55;
--color-naturalist-grey-800: #42433e;
--color-naturalist-grey-900: #2e2e2a;
--color-naturalist-grey-950: #1b1b18;
}SCSS
$naturalist-grey: #8b8c83;
$naturalist-grey-rgb: 139, 140, 131;
$naturalist-grey-light: mix(#fff, $naturalist-grey, 20%);
$naturalist-grey-dark: mix(#000, $naturalist-grey, 20%);
.element {
color: $naturalist-grey;
box-shadow: 0 0 0 2px rgba($naturalist-grey, 0.35);
}