Nazwany kolor · #D0D4E3
Light Iced Lavender
Light Iced Lavender to #D0D4E3: rgb(208 212 227), hsl(227 25% 85%), oklch(0.871 0.021 274). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Light Iced Lavender color name →
#D0D4E3
oklch(0.871 0.021 274)
Konwersje koloru
- HEX
- #d0d4e3
- RGB
- rgb(208 212 227)
- HSL
- hsl(227 25% 85%)
- HWB
- hwb(227 82% 11%)
- OKLCH
- oklch(0.871 0.021 274)
- OKLab
- oklab(0.871 0.001 -0.021)
- CIE Lab
- lab(84.94 0.72 -7.91)
- LCH
- lch(84.94 7.95 275.2)
- CMYK
- cmyk(8% 7% 0% 11%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D5D8E6
- D9DCE9
- DEE1EB
- E3E5EE
- E7E9F1
- ECEEF4
- F1F2F7
- F5F6F9
- FAFBFC
Odcienie ciemniejsze
- B5B8C5
- 9A9DA8
- 80838C
- 676971
- 4F5157
- 393A3F
- 232427
- 101012
- 020203
Tony
- C8CBD9
- BFC3CE
- B7BAC4
- AFB1BA
- A7A9B0
- 9FA1A6
- 97989D
- 8F9093
- 888889
Harmonie kolorów
Komplementarna +180°
- D0D4E3
Light Iced Lavender
- D9D5C6
≈ Plume Grass
Analogowa -30° +30°
- D0D4E3
Light Iced Lavender
- CAD7E2
≈ Blue Reflection
- D7D2E0
≈ Delicate Lilac Crystal
Triada +120° +240°
- D0D4E3
Light Iced Lavender
- E2D0CC
≈ China Silk
- CBD9CE
≈ Dry Lichen
Komplementarna rozszczepiona +150° +210°
- D0D4E3
Light Iced Lavender
- DFD2C7
≈ Pearl Bush
- D2D7C8
≈ September Song
Tetrada +90° +180° +270°
- D0D4E3
Light Iced Lavender
- E2CFD3
≈ Delicate Pink
- D9D5C6
≈ Plume Grass
- C6D9D6
≈ Cool Mint
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.47:1 · APCA Lc 23
Ag
AAANa czerni
WCAG 14.20:1 · APCA Lc 81
Najlepszy kolor tekstu: #000000
WCAG 14.20:1 (AAA) · APCA Lc 81
Contrast pairs
Fragmenty kodu
CSS
:root {
--light-iced-lavender: #d0d4e3;
--light-iced-lavender-rgb: 208 212 227;
--light-iced-lavender-oklch: oklch(0.871 0.021 274);
}
.element {
color: var(--light-iced-lavender);
background-color: hsl(227 25% 85%);
border-color: oklch(0.871 0.021 274);
}Tailwind CSS v4
@theme {
--color-light-iced-lavender: #d0d4e3;
--color-light-iced-lavender-50: #f3f5fb;
--color-light-iced-lavender-100: #e6e7ef;
--color-light-iced-lavender-200: #d1d4dd;
--color-light-iced-lavender-300: #b4b7c2;
--color-light-iced-lavender-400: #9a9eab;
--color-light-iced-lavender-500: #818595;
--color-light-iced-lavender-600: #6e717e;
--color-light-iced-lavender-700: #585a65;
--color-light-iced-lavender-800: #40424a;
--color-light-iced-lavender-900: #2c2e33;
--color-light-iced-lavender-950: #191a1f;
}SCSS
$light-iced-lavender: #d0d4e3;
$light-iced-lavender-rgb: 208, 212, 227;
$light-iced-lavender-light: mix(#fff, $light-iced-lavender, 20%);
$light-iced-lavender-dark: mix(#000, $light-iced-lavender, 20%);
.element {
color: $light-iced-lavender;
box-shadow: 0 0 0 2px rgba($light-iced-lavender, 0.35);
}