Colore con nome · #DDE0EA
Monet’s Lavender
Monet’s Lavender è #DDE0EA: rgb(221 224 234), hsl(226 24% 89%), oklch(0.907 0.014 272.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Monet’s Lavender color name →
#DDE0EA
oklch(0.907 0.014 272.7)
Conversioni di colore
- HEX
- #dde0ea
- RGB
- rgb(221 224 234)
- HSL
- hsl(226 24% 89%)
- HWB
- hwb(226 87% 8%)
- OKLCH
- oklch(0.907 0.014 272.7)
- OKLab
- oklab(0.907 0.001 -0.014)
- CIE Lab
- lab(89.16 0.34 -5.27)
- LCH
- lch(89.16 5.28 273.6)
- CMYK
- cmyk(6% 4% 0% 8%)
Tinte · Ombre · Toni
Tinte
- E0E3EC
- E4E6EE
- E7E9F0
- EAECF2
- EEEFF4
- F1F3F7
- F5F6F9
- F8F9FB
- FCFCFD
Ombre
- C0C3CB
- A4A6AE
- 888A91
- 6E7075
- 55565A
- 3D3E41
- 262729
- 111213
- 020203
Toni
- D3D6DF
- CACCD4
- C0C2C9
- B7B8BE
- ADAFB4
- A4A5A9
- 9B9C9F
- 929294
- 89898A
Armonie di colore
Complementare +180°
- DDE0EA
Monet’s Lavender
- E3E0D6
≈ Nuance
Analogo -30° +30°
- DDE0EA
Monet’s Lavender
- D9E2E9
≈ Star Map
- E2DEE8
≈ Rare Crystal
Triadico +120° +240°
- DDE0EA
Monet’s Lavender
- E9DDDB
≈ Red Dust
- DAE3DC
≈ Aqua Squeeze
Complementare divisa +150° +210°
- DDE0EA
Monet’s Lavender
- E7DFD7
≈ Starling’s Egg
- DEE2D8
≈ Jasmine Rice
Tetradico +90° +180° +270°
- DDE0EA
Monet’s Lavender
- E9DDDF
≈ Pink Posey
- E3E0D6
≈ Nuance
- D7E4E1
≈ Cirrus Blue
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.31:1 · APCA Lc 16
Ag
AAASu nero
WCAG 15.92:1 · APCA Lc 88
Miglior colore del testo: #000000
WCAG 15.92:1 (AAA) · APCA Lc 88
Contrast pairs
Frammenti di codice
CSS
:root {
--monet-s-lavender: #dde0ea;
--monet-s-lavender-rgb: 221 224 234;
--monet-s-lavender-oklch: oklch(0.907 0.014 272.7);
}
.element {
color: var(--monet-s-lavender);
background-color: hsl(226 24% 89%);
border-color: oklch(0.907 0.014 272.7);
}Tailwind CSS v4
@theme {
--color-monet-s-lavender: #dde0ea;
--color-monet-s-lavender-50: #f4f5f9;
--color-monet-s-lavender-100: #e6e8ed;
--color-monet-s-lavender-200: #d2d4da;
--color-monet-s-lavender-300: #b5b7bf;
--color-monet-s-lavender-400: #9b9ea7;
--color-monet-s-lavender-500: #838690;
--color-monet-s-lavender-600: #6f717a;
--color-monet-s-lavender-700: #585b61;
--color-monet-s-lavender-800: #404247;
--color-monet-s-lavender-900: #2c2e31;
--color-monet-s-lavender-950: #191a1d;
}SCSS
$monet-s-lavender: #dde0ea;
$monet-s-lavender-rgb: 221, 224, 234;
$monet-s-lavender-light: mix(#fff, $monet-s-lavender, 20%);
$monet-s-lavender-dark: mix(#000, $monet-s-lavender, 20%);
.element {
color: $monet-s-lavender;
box-shadow: 0 0 0 2px rgba($monet-s-lavender, 0.35);
}