Nazwany kolor · #DFF0E2
Ice-Cold White
Ice-Cold White to #DFF0E2: rgb(223 240 226), hsl(131 36% 91%), oklch(0.939 0.026 150.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Ice-Cold White color name →
#DFF0E2
oklch(0.939 0.026 150.8)
Konwersje koloru
- HEX
- #dff0e2
- RGB
- rgb(223 240 226)
- HSL
- hsl(131 36% 91%)
- HWB
- hwb(131 87% 6%)
- OKLCH
- oklch(0.939 0.026 150.8)
- OKLab
- oklab(0.939 -0.023 0.013)
- CIE Lab
- lab(93.23 -7.72 4.76)
- LCH
- lch(93.23 9.07 148.3)
- CMYK
- cmyk(7% 0% 6% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E2F2E5
- E5F3E8
- E9F5EB
- ECF6EE
- EFF8F0
- F2F9F3
- F5FBF6
- F9FCF9
- FCFEFC
Odcienie ciemniejsze
- C2D1C4
- A5B2A8
- 8A958C
- 6F7871
- 565D57
- 3D433E
- 272A27
- 121412
- 020303
Tony
- D5E4D8
- CBD9CE
- C2CDC4
- B8C2BA
- AEB6B0
- A5ABA6
- 9CA09C
- 929593
- 898B89
Harmonie kolorów
Komplementarna +180°
- DFF0E2
Ice-Cold White
- F5E5F3
≈ Soft Lavender
Analogowa -30° +30°
- DFF0E2
Ice-Cold White
- E8EEDB
≈ Diluted Lime
- D9F1EB
≈ Green Frosting
Triada +120° +240°
- DFF0E2
Ice-Cold White
- E4EAFD
≈ Icy Lilac
- FCE5E0
≈ Sweet Nothing
Komplementarna rozszczepiona +150° +210°
- DFF0E2
Ice-Cold White
- EDE7FA
≈ Bright Dusk
- FBE4EA
≈ Hepatica
Tetrada +90° +180° +270°
- DFF0E2
Ice-Cold White
- DCEDFB
≈ Hoarfrost
- F5E5F3
≈ Soft Lavender
- F8E7DA
≈ Hint of Orange
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.18:1 · APCA Lc 9
Ag
AAANa czerni
WCAG 17.69:1 · APCA Lc 95
Najlepszy kolor tekstu: #000000
WCAG 17.69:1 (AAA) · APCA Lc 95
Contrast pairs
Fragmenty kodu
CSS
:root {
--ice-cold-white: #dff0e2;
--ice-cold-white-rgb: 223 240 226;
--ice-cold-white-oklch: oklch(0.939 0.026 150.8);
}
.element {
color: var(--ice-cold-white);
background-color: hsl(131 36% 91%);
border-color: oklch(0.939 0.026 150.8);
}Tailwind CSS v4
@theme {
--color-ice-cold-white: #dff0e2;
--color-ice-cold-white-50: #f0f7f2;
--color-ice-cold-white-100: #e2eae4;
--color-ice-cold-white-200: #ccd8cf;
--color-ice-cold-white-300: #aebbb1;
--color-ice-cold-white-400: #94a397;
--color-ice-cold-white-500: #7a8b7d;
--color-ice-cold-white-600: #68766a;
--color-ice-cold-white-700: #535e55;
--color-ice-cold-white-800: #3c453d;
--color-ice-cold-white-900: #2a302a;
--color-ice-cold-white-950: #171c18;
}SCSS
$ice-cold-white: #dff0e2;
$ice-cold-white-rgb: 223, 240, 226;
$ice-cold-white-light: mix(#fff, $ice-cold-white, 20%);
$ice-cold-white-dark: mix(#000, $ice-cold-white, 20%);
.element {
color: $ice-cold-white;
box-shadow: 0 0 0 2px rgba($ice-cold-white, 0.35);
}