Adlandırılmış renk · #C2BDB1
Roycroft Mist Grey
Roycroft Mist Grey, #C2BDB1: rgb(194 189 177), hsl(42 12% 73%), oklch(0.799 0.018 88). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Roycroft Mist Grey color name →
#C2BDB1
oklch(0.799 0.018 88)
Renk dönüşümleri
- HEX
- #c2bdb1
- RGB
- rgb(194 189 177)
- HSL
- hsl(42 12% 73%)
- HWB
- hwb(42 69% 24%)
- OKLCH
- oklch(0.799 0.018 88)
- OKLab
- oklab(0.799 0.001 0.018)
- CIE Lab
- lab(76.77 0.25 6.74)
- LCH
- lch(76.77 6.75 87.9)
- CMYK
- cmyk(0% 3% 9% 24%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C8C3B9
- CECAC0
- D4D0C8
- DAD7D0
- E0DED7
- E6E4DF
- ECEBE7
- F3F2EF
- F9F8F7
Koyu tonlar
- A8A499
- 8F8C83
- 77746C
- 605D57
- 494742
- 34332F
- 201F1C
- 0E0D0C
- 020201
Gri tonlar
- BBB7AC
- B4B0A7
- AEAAA2
- A7A49D
- A09E98
- 9A9893
- 93928E
- 8D8C8A
- 868685
Renk uyumları
Tamamlayıcı +180°
- C2BDB1
Roycroft Mist Grey
- B8BDC9
≈ Blue Rinse
Analog -30° +30°
- C2BDB1
Roycroft Mist Grey
- C7BBB3
≈ Seagull Beach
- BCBFB3
≈ Austere Grey
Üçlü +120° +240°
- C2BDB1
Roycroft Mist Grey
- B1C1C3
≈ Jolene
- C4BAC3
≈ Pocketful of Posies
Bölünmüş tamamlayıcı +150° +210°
- C2BDB1
Roycroft Mist Grey
- B4BFC8
≈ Winter Wonderland
- BEBBC8
≈ Silverberry
Dörtlü +90° +180° +270°
- C2BDB1
Roycroft Mist Grey
- B2C1BD
≈ Sea Glass
- B8BDC9
≈ Blue Rinse
- C8B9BD
≈ Iris Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.87:1 · APCA Lc 35
Ag
AAASiyah üzerinde
WCAG 11.20:1 · APCA Lc 67
En iyi metin rengi: #000000
WCAG 11.20:1 (AAA) · APCA Lc 67
Contrast pairs
Kod parçacıkları
CSS
:root {
--roycroft-mist-grey: #c2bdb1;
--roycroft-mist-grey-rgb: 194 189 177;
--roycroft-mist-grey-oklch: oklch(0.799 0.018 88);
}
.element {
color: var(--roycroft-mist-grey);
background-color: hsl(42 12% 73%);
border-color: oklch(0.799 0.018 88);
}Tailwind CSS v4
@theme {
--color-roycroft-mist-grey: #c2bdb1;
--color-roycroft-mist-grey-50: #f7f5f0;
--color-roycroft-mist-grey-100: #eae8e1;
--color-roycroft-mist-grey-200: #d7d4cc;
--color-roycroft-mist-grey-300: #bbb7ad;
--color-roycroft-mist-grey-400: #a39e93;
--color-roycroft-mist-grey-500: #8b8679;
--color-roycroft-mist-grey-600: #767167;
--color-roycroft-mist-grey-700: #5e5a52;
--color-roycroft-mist-grey-800: #45423c;
--color-roycroft-mist-grey-900: #302e29;
--color-roycroft-mist-grey-950: #1c1a17;
}SCSS
$roycroft-mist-grey: #c2bdb1;
$roycroft-mist-grey-rgb: 194, 189, 177;
$roycroft-mist-grey-light: mix(#fff, $roycroft-mist-grey, 20%);
$roycroft-mist-grey-dark: mix(#000, $roycroft-mist-grey, 20%);
.element {
color: $roycroft-mist-grey;
box-shadow: 0 0 0 2px rgba($roycroft-mist-grey, 0.35);
}