Benannte Farbe · #C5C3B4
Comforting Grey
Comforting Grey ist #C5C3B4: rgb(197 195 180), hsl(53 13% 74%), oklch(0.815 0.021 100.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Comforting Grey color name →
#C5C3B4
oklch(0.815 0.021 100.7)
Farbumrechnungen
- HEX
- #c5c3b4
- RGB
- rgb(197 195 180)
- HSL
- hsl(53 13% 74%)
- HWB
- hwb(53 71% 23%)
- OKLCH
- oklch(0.815 0.021 100.7)
- OKLab
- oklab(0.815 -0.004 0.02)
- CIE Lab
- lab(78.64 -1.24 7.83)
- LCH
- lch(78.64 7.93 99)
- CMYK
- cmyk(0% 1% 9% 23%)
Tints · Shades · Tones
Tints
- CBC9BB
- D0CFC3
- D6D5CA
- DCDBD2
- E2E1D9
- E7E7E1
- EDEDE8
- F3F3F0
- F9F9F7
Shades
- ABA99C
- 929085
- 79786E
- 616058
- 4B4A44
- 353430
- 21201D
- 0E0E0C
- 020202
Tones
- BEBCAF
- B7B5A9
- B0AEA4
- A9A89F
- A2A19A
- 9B9A94
- 94948F
- 8D8D8A
- 878685
Farbharmonien
Komplementär +180°
- C5C3B4
Comforting Grey
- BFC1D0
≈ Whomp Grey
Analog -30° +30°
- C5C3B4
Comforting Grey
- CBC0B4
≈ Loophole
- BEC5B8
≈ Balsam
Triadisch +120° +240°
- C5C3B4
Comforting Grey
- B5C6CC
≈ Star Mist
- CCBDC6
≈ Silk Chiffon
Geteilt komplementär +150° +210°
- C5C3B4
Comforting Grey
- B9C4D0
≈ Plein Air
- C7BFCD
≈ Clary Sage
Tetradisch +90° +180° +270°
- C5C3B4
Comforting Grey
- B4C7C5
≈ Surf Spray
- BFC1D0
≈ Whomp Grey
- CFBDBF
≈ Dusky Violet
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.77:1 · APCA Lc 33
Ag
AAAAuf Schwarz
WCAG 11.83:1 · APCA Lc 70
Beste Textfarbe: #000000
WCAG 11.83:1 (AAA) · APCA Lc 70
Contrast pairs
Code-Snippets
CSS
:root {
--comforting-grey: #c5c3b4;
--comforting-grey-rgb: 197 195 180;
--comforting-grey-oklch: oklch(0.815 0.021 100.7);
}
.element {
color: var(--comforting-grey);
background-color: hsl(53 13% 74%);
border-color: oklch(0.815 0.021 100.7);
}Tailwind CSS v4
@theme {
--color-comforting-grey: #c5c3b4;
--color-comforting-grey-50: #f6f5ef;
--color-comforting-grey-100: #e9e8e0;
--color-comforting-grey-200: #d6d5cb;
--color-comforting-grey-300: #b9b8ac;
--color-comforting-grey-400: #a19f91;
--color-comforting-grey-500: #898777;
--color-comforting-grey-600: #747265;
--color-comforting-grey-700: #5d5b51;
--color-comforting-grey-800: #44433b;
--color-comforting-grey-900: #2f2e28;
--color-comforting-grey-950: #1c1b16;
}SCSS
$comforting-grey: #c5c3b4;
$comforting-grey-rgb: 197, 195, 180;
$comforting-grey-light: mix(#fff, $comforting-grey, 20%);
$comforting-grey-dark: mix(#000, $comforting-grey, 20%);
.element {
color: $comforting-grey;
box-shadow: 0 0 0 2px rgba($comforting-grey, 0.35);
}