Adlandırılmış renk · #B1A685
Crocker Grove
Crocker Grove, #B1A685: rgb(177 166 133), hsl(45 22% 61%), oklch(0.726 0.047 91.8). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Crocker Grove color name →
#B1A685
oklch(0.726 0.047 91.8)
Renk dönüşümleri
- HEX
- #b1a685
- RGB
- rgb(177 166 133)
- HSL
- hsl(45 22% 61%)
- HWB
- hwb(45 52% 31%)
- OKLCH
- oklch(0.726 0.047 91.8)
- OKLab
- oklab(0.726 -0.001 0.047)
- CIE Lab
- lab(68.42 0.16 18.67)
- LCH
- lch(68.42 18.67 89.5)
- CMYK
- cmyk(0% 6% 25% 31%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- B9AF91
- C0B79D
- C8C0A9
- D0C9B5
- D7D2C1
- DFDBCD
- E7E4D9
- EFEDE6
- F7F6F2
Koyu tonlar
- 999073
- 837A61
- 6C6550
- 575140
- 423E30
- 2F2B21
- 1C1A13
- 0C0A06
- 010101
Gri tonlar
- ACA285
- A79E84
- A29B84
- 9D9784
- 989383
- 938F83
- 8E8B82
- 8A8881
- 858481
Renk uyumları
Tamamlayıcı +180°
- B1A685
Crocker Grove
- 9CA5C5
≈ Wild Phlox
Analog -30° +30°
- B1A685
Crocker Grove
- BDA089
≈ Doe Eyes
- A1AC8B
≈ Sagey
Üçlü +120° +240°
- B1A685
Crocker Grove
- 84AFB8
≈ Sebastian Inlet
- B99CB4
≈ Pastel Purple
Bölünmüş tamamlayıcı +150° +210°
- B1A685
Crocker Grove
- 8DABC2
≈ Sky Eyes
- ACA0C0
≈ Iris Blossom
Dörtlü +90° +180° +270°
- B1A685
Crocker Grove
- 86B1A8
≈ Silicate Green
- 9CA5C5
≈ Wild Phlox
- C19BA4
≈ Artichoke Mauve
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.42:1 · APCA Lc 48
Ag
AAASiyah üzerinde
WCAG 8.66:1 · APCA Lc 54
En iyi metin rengi: #000000
WCAG 8.66:1 (AAA) · APCA Lc 54
Contrast pairs
Kod parçacıkları
CSS
:root {
--crocker-grove: #b1a685;
--crocker-grove-rgb: 177 166 133;
--crocker-grove-oklch: oklch(0.726 0.047 91.8);
}
.element {
color: var(--crocker-grove);
background-color: hsl(45 22% 61%);
border-color: oklch(0.726 0.047 91.8);
}Tailwind CSS v4
@theme {
--color-crocker-grove: #b1a685;
--color-crocker-grove-50: #f9f5e6;
--color-crocker-grove-100: #ede8d7;
--color-crocker-grove-200: #dbd4be;
--color-crocker-grove-300: #bfb79d;
--color-crocker-grove-400: #a89e7f;
--color-crocker-grove-500: #918662;
--color-crocker-grove-600: #7b7153;
--color-crocker-grove-700: #625a42;
--color-crocker-grove-800: #494230;
--color-crocker-grove-900: #322d20;
--color-crocker-grove-950: #1e1a10;
}SCSS
$crocker-grove: #b1a685;
$crocker-grove-rgb: 177, 166, 133;
$crocker-grove-light: mix(#fff, $crocker-grove, 20%);
$crocker-grove-dark: mix(#000, $crocker-grove, 20%);
.element {
color: $crocker-grove;
box-shadow: 0 0 0 2px rgba($crocker-grove, 0.35);
}