Cor nomeada · #DCDDE7
Hosta Flower
Hosta Flower é #DCDDE7: rgb(220 221 231), hsl(235 19% 88%), oklch(0.9 0.014 281.5). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Hosta Flower color name →
#DCDDE7
oklch(0.9 0.014 281.5)
Conversões de cor
- HEX
- #dcdde7
- RGB
- rgb(220 221 231)
- HSL
- hsl(235 19% 88%)
- HWB
- hwb(235 86% 9%)
- OKLCH
- oklch(0.9 0.014 281.5)
- OKLab
- oklab(0.9 0.003 -0.013)
- CIE Lab
- lab(88.26 1.03 -5.03)
- LCH
- lch(88.26 5.14 281.5)
- CMYK
- cmyk(5% 4% 0% 9%)
Tons claros · Sombras · Tons
Tons claros
- DFE0E9
- E3E4EC
- E6E7EE
- EAEAF1
- EDEEF3
- F1F1F5
- F4F5F8
- F8F8FA
- FBFCFD
Sombras
- BFC0C9
- A3A4AB
- 88888F
- 6E6E73
- 545559
- 3C3D40
- 262628
- 111113
- 020203
Tons
- D2D3DC
- C9CAD2
- BFC0C7
- B6B7BC
- ADADB2
- A4A4A8
- 9B9B9E
- 929294
- 89898A
Harmonias de cor
Complementar +180°
- DCDDE7
Hosta Flower
- DFDED4
≈ Clear Stone
Análoga -30° +30°
- DCDDE7
Hosta Flower
- D8DFE7
≈ Blustery Day
- E1DBE5
≈ He Loves Me
Tríade +120° +240°
- DCDDE7
Hosta Flower
- E6DBD7
≈ Light Watermelon Milk
- D6E1DB
≈ Night Wind
Complementar dividida +150° +210°
- DCDDE7
Hosta Flower
- E4DDD4
≈ Aesthetic White
- DBE0D7
≈ Just a Little
Tétrade +90° +180° +270°
- DCDDE7
Hosta Flower
- E7DADB
≈ Death Cap
- DFDED4
≈ Clear Stone
- D4E1E0
≈ Pristine Petal
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.35:1 · APCA Lc 17
Ag
AAASobre preto
WCAG 15.53:1 · APCA Lc 86
Melhor cor de texto: #000000
WCAG 15.53:1 (AAA) · APCA Lc 86
Contrast pairs
Trechos de código
CSS
:root {
--hosta-flower: #dcdde7;
--hosta-flower-rgb: 220 221 231;
--hosta-flower-oklch: oklch(0.9 0.014 281.5);
}
.element {
color: var(--hosta-flower);
background-color: hsl(235 19% 88%);
border-color: oklch(0.9 0.014 281.5);
}Tailwind CSS v4
@theme {
--color-hosta-flower: #dcdde7;
--color-hosta-flower-50: #f4f5f9;
--color-hosta-flower-100: #e7e7ec;
--color-hosta-flower-200: #d3d3da;
--color-hosta-flower-300: #b6b7be;
--color-hosta-flower-400: #9d9ea7;
--color-hosta-flower-500: #84858f;
--color-hosta-flower-600: #707179;
--color-hosta-flower-700: #5a5a61;
--color-hosta-flower-800: #414247;
--color-hosta-flower-900: #2d2d31;
--color-hosta-flower-950: #1a1a1d;
}SCSS
$hosta-flower: #dcdde7;
$hosta-flower-rgb: 220, 221, 231;
$hosta-flower-light: mix(#fff, $hosta-flower, 20%);
$hosta-flower-dark: mix(#000, $hosta-flower, 20%);
.element {
color: $hosta-flower;
box-shadow: 0 0 0 2px rgba($hosta-flower, 0.35);
}