Nazwany kolor · #D6C9DE
Watercolour Grape
Watercolour Grape to #D6C9DE: rgb(214 201 222), hsl(277 24% 83%), oklch(0.853 0.032 312.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Watercolour Grape color name →
#D6C9DE
oklch(0.853 0.032 312.8)
Konwersje koloru
- HEX
- #d6c9de
- RGB
- rgb(214 201 222)
- HSL
- hsl(277 24% 83%)
- HWB
- hwb(277 79% 13%)
- OKLCH
- oklch(0.853 0.032 312.8)
- OKLab
- oklab(0.853 0.022 -0.023)
- CIE Lab
- lab(82.52 7.52 -8.75)
- LCH
- lch(82.52 11.54 310.7)
- CMYK
- cmyk(4% 9% 0% 13%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- DACEE1
- DED4E5
- E2D9E8
- E6DEEB
- EAE4EE
- EEE9F2
- F3EFF5
- F7F4F8
- FBFAFC
Odcienie ciemniejsze
- BAAEC1
- 9E95A5
- 847C89
- 6A646F
- 524C55
- 3B363D
- 252226
- 100F12
- 020202
Tony
- CDC1D4
- C4BACB
- BBB3C1
- B3ABB7
- AAA4AE
- A19DA5
- 99959B
- 918E92
- 888789
Harmonie kolorów
Komplementarna +180°
- D6C9DE
Watercolour Grape
- C7D4BE
≈ Willow Tree Mouse
Analogowa -30° +30°
- D6C9DE
Watercolour Grape
- CBCDE4
≈ Casa del Mar
- DFC7D4
≈ Matt Lilac
Triada +120° +240°
- D6C9DE
Watercolour Grape
- DCCCB8
≈ Palest Satin
- B8D6D4
≈ Wingsuit Wind
Komplementarna rozszczepiona +150° +210°
- D6C9DE
Watercolour Grape
- D2D0B8
≈ Pale Sagebrush
- BDD6C9
≈ Malted Mint
Tetrada +90° +180° +270°
- D6C9DE
Watercolour Grape
- E2C8BE
≈ Sultan Sand
- C7D4BE
≈ Willow Tree Mouse
- B9D4DE
≈ Millstream
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.58:1 · APCA Lc 26
Ag
AAANa czerni
WCAG 13.26:1 · APCA Lc 77
Najlepszy kolor tekstu: #000000
WCAG 13.26:1 (AAA) · APCA Lc 77
Contrast pairs
Fragmenty kodu
CSS
:root {
--watercolour-grape: #d6c9de;
--watercolour-grape-rgb: 214 201 222;
--watercolour-grape-oklch: oklch(0.853 0.032 312.8);
}
.element {
color: var(--watercolour-grape);
background-color: hsl(277 24% 83%);
border-color: oklch(0.853 0.032 312.8);
}Tailwind CSS v4
@theme {
--color-watercolour-grape: #d6c9de;
--color-watercolour-grape-50: #f9f3fc;
--color-watercolour-grape-100: #ece5ef;
--color-watercolour-grape-200: #d9d0de;
--color-watercolour-grape-300: #beb3c3;
--color-watercolour-grape-400: #a599ac;
--color-watercolour-grape-500: #8e8096;
--color-watercolour-grape-600: #786d7f;
--color-watercolour-grape-700: #605765;
--color-watercolour-grape-800: #463f4b;
--color-watercolour-grape-900: #302c34;
--color-watercolour-grape-950: #1d191f;
}SCSS
$watercolour-grape: #d6c9de;
$watercolour-grape-rgb: 214, 201, 222;
$watercolour-grape-light: mix(#fff, $watercolour-grape, 20%);
$watercolour-grape-dark: mix(#000, $watercolour-grape, 20%);
.element {
color: $watercolour-grape;
box-shadow: 0 0 0 2px rgba($watercolour-grape, 0.35);
}