Nazwany kolor · #D3C5C0
Natural Silk Grey
Natural Silk Grey to #D3C5C0: rgb(211 197 192), hsl(16 18% 79%), oklch(0.834 0.017 40.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Natural Silk Grey color name →
#D3C5C0
oklch(0.834 0.017 40.8)
Konwersje koloru
- HEX
- #d3c5c0
- RGB
- rgb(211 197 192)
- HSL
- hsl(16 18% 79%)
- HWB
- hwb(16 75% 17%)
- OKLCH
- oklch(0.834 0.017 40.8)
- OKLab
- oklab(0.834 0.013 0.011)
- CIE Lab
- lab(80.58 4.43 4.37)
- LCH
- lch(80.58 6.23 44.6)
- CMYK
- cmyk(0% 7% 9% 17%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D7CBC6
- DCD0CC
- E0D6D3
- E4DCD9
- E9E2DF
- EDE7E5
- F2EDEC
- F6F3F2
- FBF9F9
Odcienie ciemniejsze
- B7ABA7
- 9C928E
- 827976
- 69615F
- 514B49
- 3A3534
- 242120
- 100E0E
- 020202
Tony
- CABEB9
- C2B7B3
- B9B0AC
- B1A9A6
- A9A29F
- A09B99
- 989493
- 908D8C
- 888786
Harmonie kolorów
Komplementarna +180°
- D3C5C0
Natural Silk Grey
- BDCBD0
≈ Sleepy Blue
Analogowa -30° +30°
- D3C5C0
Natural Silk Grey
- D3C4C6
≈ Mother of Pearl Pink
- D0C7BD
≈ Smoked Umber
Triada +120° +240°
- D3C5C0
Natural Silk Grey
- BFCCC5
≈ Amelia
- C6C7D4
≈ Hyacinth Ice
Komplementarna rozszczepiona +150° +210°
- D3C5C0
Natural Silk Grey
- BCCCCB
≈ Urban Raincoat
- C0CAD4
≈ Light Spirit
Tetrada +90° +180° +270°
- D3C5C0
Natural Silk Grey
- C4CBBF
≈ Life Lesson
- BDCBD0
≈ Sleepy Blue
- CCC5D1
≈ Orchid Hush
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.67:1 · APCA Lc 30
Ag
AAANa czerni
WCAG 12.51:1 · APCA Lc 73
Najlepszy kolor tekstu: #000000
WCAG 12.51:1 (AAA) · APCA Lc 73
Contrast pairs
Fragmenty kodu
CSS
:root {
--natural-silk-grey: #d3c5c0;
--natural-silk-grey-rgb: 211 197 192;
--natural-silk-grey-oklch: oklch(0.834 0.017 40.8);
}
.element {
color: var(--natural-silk-grey);
background-color: hsl(16 18% 79%);
border-color: oklch(0.834 0.017 40.8);
}Tailwind CSS v4
@theme {
--color-natural-silk-grey: #d3c5c0;
--color-natural-silk-grey-50: #faf4f1;
--color-natural-silk-grey-100: #ede6e3;
--color-natural-silk-grey-200: #dbd2ce;
--color-natural-silk-grey-300: #c0b5b0;
--color-natural-silk-grey-400: #a89b97;
--color-natural-silk-grey-500: #91837e;
--color-natural-silk-grey-600: #7b6f6a;
--color-natural-silk-grey-700: #625855;
--color-natural-silk-grey-800: #48403e;
--color-natural-silk-grey-900: #322c2b;
--color-natural-silk-grey-950: #1e1918;
}SCSS
$natural-silk-grey: #d3c5c0;
$natural-silk-grey-rgb: 211, 197, 192;
$natural-silk-grey-light: mix(#fff, $natural-silk-grey, 20%);
$natural-silk-grey-dark: mix(#000, $natural-silk-grey, 20%);
.element {
color: $natural-silk-grey;
box-shadow: 0 0 0 2px rgba($natural-silk-grey, 0.35);
}