Benoemde kleur · #D1F1F5
Windswept
Windswept is #D1F1F5: rgb(209 241 245), hsl(187 64% 89%), oklch(0.936 0.034 205.8). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Gray mean? → · Windswept color name →
#D1F1F5
oklch(0.936 0.034 205.8)
Kleurconversies
- HEX
- #d1f1f5
- RGB
- rgb(209 241 245)
- HSL
- hsl(187 64% 89%)
- HWB
- hwb(187 82% 4%)
- OKLCH
- oklch(0.936 0.034 205.8)
- OKLab
- oklab(0.936 -0.03 -0.015)
- CIE Lab
- lab(92.92 -10.17 -5.63)
- LCH
- lch(92.92 11.63 209)
- CMYK
- cmyk(15% 2% 0% 4%)
Tinten · Schaduwen · Tonen
Tinten
- D6F2F6
- DAF4F7
- DFF5F8
- E4F7F9
- E8F8FA
- EDF9FB
- F1FBFC
- F6FCFD
- FAFEFE
Schaduwen
- B5D2D5
- 9BB3B6
- 819598
- 68797B
- 505D5F
- 394344
- 232B2B
- 101415
- 020303
Tonen
- C9E5E9
- C0D9DD
- B8CED0
- B0C2C5
- A8B7B9
- A0ACAD
- 98A1A2
- 909696
- 888B8B
Kleurharmonieën
Complementair +180°
- D1F1F5
Windswept
- FFE2DF
≈ Lady Anne
Analoog -30° +30°
- D1F1F5
Windswept
- D4F2E9
≈ Waterslide
- D5EEFE
≈ Ice Castle
Triadisch +120° +240°
- D1F1F5
Windswept
- F6E3F6
≈ Soft Lavender
- F4E9D1
≈ Golden Mushroom
Gesplitst complementair +150° +210°
- D1F1F5
Windswept
- FEE1EB
≈ Baby Girl
- FDE5D5
≈ Winthrop Peach
Tetradisch +90° +180° +270°
- D1F1F5
Windswept
- EBE6FF
≈ Cyber Lavender
- FFE2DF
≈ Lady Anne
- E8EDD4
≈ Just Perfect
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.19:1 · APCA Lc 9
Ag
AAAOp zwart
WCAG 17.61:1 · APCA Lc 95
Beste tekstkleur: #000000
WCAG 17.61:1 (AAA) · APCA Lc 95
Contrast pairs
Codefragmenten
CSS
:root {
--windswept: #d1f1f5;
--windswept-rgb: 209 241 245;
--windswept-oklch: oklch(0.936 0.034 205.8);
}
.element {
color: var(--windswept);
background-color: hsl(187 64% 89%);
border-color: oklch(0.936 0.034 205.8);
}Tailwind CSS v4
@theme {
--color-windswept: #d1f1f5;
--color-windswept-50: #ebf8fa;
--color-windswept-100: #dcebee;
--color-windswept-200: #c5d9dc;
--color-windswept-300: #a4bdc0;
--color-windswept-400: #88a5a8;
--color-windswept-500: #6c8d91;
--color-windswept-600: #5c777b;
--color-windswept-700: #495f62;
--color-windswept-800: #354648;
--color-windswept-900: #243032;
--color-windswept-950: #131d1e;
}SCSS
$windswept: #d1f1f5;
$windswept-rgb: 209, 241, 245;
$windswept-light: mix(#fff, $windswept, 20%);
$windswept-dark: mix(#000, $windswept, 20%);
.element {
color: $windswept;
box-shadow: 0 0 0 2px rgba($windswept, 0.35);
}