Benoemde kleur · #E4DFD0
White Basics
White Basics is #E4DFD0: rgb(228 223 208), hsl(45 27% 85%), oklch(0.903 0.021 91.6). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Gray mean? → · White Basics color name →
#E4DFD0
oklch(0.903 0.021 91.6)
Kleurconversies
- HEX
- #e4dfd0
- RGB
- rgb(228 223 208)
- HSL
- hsl(45 27% 85%)
- HWB
- hwb(45 82% 11%)
- OKLCH
- oklch(0.903 0.021 91.6)
- OKLab
- oklab(0.903 -0.001 0.021)
- CIE Lab
- lab(88.92 -0.14 8.01)
- LCH
- lch(88.92 8.01 91)
- CMYK
- cmyk(0% 2% 9% 11%)
Tinten · Schaduwen · Tonen
Tinten
- E7E2D5
- E9E5D9
- ECE9DE
- EFECE3
- F1EFE7
- F4F2EC
- F7F5F1
- FAF9F6
- FCFCFA
Schaduwen
- C6C2B5
- A9A59A
- 8D8A80
- 726F67
- 58564F
- 3F3D39
- 282723
- 121210
- 030202
Tonen
- DAD5C8
- CFCBBF
- C5C2B7
- BBB8AF
- B1AEA7
- A7A59F
- 9D9B97
- 93928F
- 8A8988
Kleurharmonieën
Complementair +180°
- E4DFD0
White Basics
- DADFEE
≈ Timid Blue
Analoog -30° +30°
- E4DFD0
White Basics
- EADCD2
≈ Hudson
- DDE2D3
≈ Moss Mist
Triadisch +120° +240°
- E4DFD0
White Basics
- D0E3E7
≈ Open Skies
- E8DAE5
≈ Twinkled Pink
Gesplitst complementair +150° +210°
- E4DFD0
White Basics
- D4E1EC
≈ Brush Blue
- E1DCEB
≈ Awakened
Tetradisch +90° +180° +270°
- E4DFD0
White Basics
- D1E4E0
≈ Ice Dagger
- DADFEE
≈ Timid Blue
- ECDADE
≈ Sweet Bianca
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.33:1 · APCA Lc 16
Ag
AAAOp zwart
WCAG 15.76:1 · APCA Lc 87
Beste tekstkleur: #000000
WCAG 15.76:1 (AAA) · APCA Lc 87
Contrast pairs
Codefragmenten
CSS
:root {
--white-basics: #e4dfd0;
--white-basics-rgb: 228 223 208;
--white-basics-oklch: oklch(0.903 0.021 91.6);
}
.element {
color: var(--white-basics);
background-color: hsl(45 27% 85%);
border-color: oklch(0.903 0.021 91.6);
}Tailwind CSS v4
@theme {
--color-white-basics: #e4dfd0;
--color-white-basics-50: #f7f5ef;
--color-white-basics-100: #eae8e0;
--color-white-basics-200: #d7d4ca;
--color-white-basics-300: #bbb7ac;
--color-white-basics-400: #a39e91;
--color-white-basics-500: #8b8677;
--color-white-basics-600: #767165;
--color-white-basics-700: #5e5b50;
--color-white-basics-800: #45423a;
--color-white-basics-900: #302e28;
--color-white-basics-950: #1c1a16;
}SCSS
$white-basics: #e4dfd0;
$white-basics-rgb: 228, 223, 208;
$white-basics-light: mix(#fff, $white-basics, 20%);
$white-basics-dark: mix(#000, $white-basics, 20%);
.element {
color: $white-basics;
box-shadow: 0 0 0 2px rgba($white-basics, 0.35);
}