Nazwany kolor · #D8D4D7
So Fresh so Clean
So Fresh so Clean to #D8D4D7: rgb(216 212 215), hsl(315 5% 84%), oklch(0.874 0.006 334). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · So Fresh so Clean color name →
#D8D4D7
oklch(0.874 0.006 334)
Konwersje koloru
- HEX
- #d8d4d7
- RGB
- rgb(216 212 215)
- HSL
- hsl(315 5% 84%)
- HWB
- hwb(315 83% 15%)
- OKLCH
- oklch(0.874 0.006 334)
- OKLab
- oklab(0.874 0.005 -0.003)
- CIE Lab
- lab(85.3 1.82 -0.98)
- LCH
- lch(85.3 2.06 331.8)
- CMYK
- cmyk(0% 2% 0% 15%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- DCD8DB
- E0DCDF
- E4E1E3
- E7E5E7
- EBE9EB
- EFEEEF
- F3F2F3
- F7F6F7
- FBFBFB
Odcienie ciemniejsze
- BCB8BB
- A09D9F
- 858385
- 6B696B
- 535152
- 3B3A3B
- 252425
- 111011
- 020202
Tony
- CFCBCE
- C6C3C5
- BDBABC
- B4B1B3
- ABA9AA
- A2A1A2
- 9A9899
- 919091
- 888888
Harmonie kolorów
Komplementarna +180°
- D8D4D7
So Fresh so Clean
- D3D7D4
≈ Cool Vapour
Analogowa -30° +30°
- D8D4D7
So Fresh so Clean
- D6D4D9
≈ Mirror Ball
- D9D4D5
≈ So Fresh so Clean
Triada +120° +240°
- D8D4D7
So Fresh so Clean
- D7D5D1
≈ Light Brume
- D1D6D8
≈ Twilight Grey
Komplementarna rozszczepiona +150° +210°
- D8D4D7
So Fresh so Clean
- D4D6D2
≈ Modern Monument
- D1D7D6
≈ Twilight Grey
Tetrada +90° +180° +270°
- D8D4D7
So Fresh so Clean
- D8D5D1
≈ Light Vanilla Quake
- D3D7D4
≈ Cool Vapour
- D2D6D9
≈ Angel Hair Silver
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.46:1 · APCA Lc 22
Ag
AAANa czerni
WCAG 14.31:1 · APCA Lc 81
Najlepszy kolor tekstu: #000000
WCAG 14.31:1 (AAA) · APCA Lc 81
Contrast pairs
Fragmenty kodu
CSS
:root {
--so-fresh-so-clean: #d8d4d7;
--so-fresh-so-clean-rgb: 216 212 215;
--so-fresh-so-clean-oklch: oklch(0.874 0.006 334);
}
.element {
color: var(--so-fresh-so-clean);
background-color: hsl(315 5% 84%);
border-color: oklch(0.874 0.006 334);
}Tailwind CSS v4
@theme {
--color-so-fresh-so-clean: #d8d4d7;
--color-so-fresh-so-clean-50: #f6f4f6;
--color-so-fresh-so-clean-100: #e9e7e8;
--color-so-fresh-so-clean-200: #d6d3d5;
--color-so-fresh-so-clean-300: #b9b6b8;
--color-so-fresh-so-clean-400: #a19da0;
--color-so-fresh-so-clean-500: #898588;
--color-so-fresh-so-clean-600: #747073;
--color-so-fresh-so-clean-700: #5d5a5c;
--color-so-fresh-so-clean-800: #444243;
--color-so-fresh-so-clean-900: #2f2d2e;
--color-so-fresh-so-clean-950: #1b1a1b;
}SCSS
$so-fresh-so-clean: #d8d4d7;
$so-fresh-so-clean-rgb: 216, 212, 215;
$so-fresh-so-clean-light: mix(#fff, $so-fresh-so-clean, 20%);
$so-fresh-so-clean-dark: mix(#000, $so-fresh-so-clean, 20%);
.element {
color: $so-fresh-so-clean;
box-shadow: 0 0 0 2px rgba($so-fresh-so-clean, 0.35);
}