Benoemde kleur · #E5DFCD
Pueblo White
Pueblo White is #E5DFCD: rgb(229 223 205), hsl(45 32% 85%), oklch(0.904 0.025 91.6). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Gray mean? → · Pueblo White color name →
#E5DFCD
oklch(0.904 0.025 91.6)
Kleurconversies
- HEX
- #e5dfcd
- RGB
- rgb(229 223 205)
- HSL
- hsl(45 32% 85%)
- HWB
- hwb(45 80% 10%)
- OKLCH
- oklch(0.904 0.025 91.6)
- OKLab
- oklab(0.904 -0.001 0.025)
- CIE Lab
- lab(88.94 -0.14 9.62)
- LCH
- lch(88.94 9.62 90.8)
- CMYK
- cmyk(0% 3% 10% 10%)
Tinten · Schaduwen · Tonen
Tinten
- E8E2D2
- EAE5D7
- EDE9DC
- EFECE1
- F2EFE6
- F5F2EB
- F7F5F0
- FAF9F5
- FCFCFA
Schaduwen
- C7C2B2
- AAA598
- 8E8A7E
- 726F66
- 58564E
- 3F3D38
- 282723
- 12120F
- 030202
Tonen
- DAD5C5
- D0CBBD
- C6C2B5
- BBB8AD
- B1AEA6
- A7A59E
- 9D9B96
- 93928F
- 8A8987
Kleurharmonieën
Complementair +180°
- E5DFCD
Pueblo White
- D9DFF0
≈ Lower Lavender
Analoog -30° +30°
- E5DFCD
Pueblo White
- ECDCCF
≈ Palatial
- DCE2D0
≈ Mystical Sea
Triadisch +120° +240°
- E5DFCD
Pueblo White
- CDE4E9
≈ Northwind
- EAD9E7
≈ Mountain Heather
Gesplitst complementair +150° +210°
- E5DFCD
Pueblo White
- D1E2EF
≈ Ice Drop
- E2DCED
≈ Princess Fairy Tale
Tetradisch +90° +180° +270°
- E5DFCD
Pueblo White
- CEE5E0
≈ Ice Dagger
- D9DFF0
≈ Lower Lavender
- EED9DE
≈ 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 {
--pueblo-white: #e5dfcd;
--pueblo-white-rgb: 229 223 205;
--pueblo-white-oklch: oklch(0.904 0.025 91.6);
}
.element {
color: var(--pueblo-white);
background-color: hsl(45 32% 85%);
border-color: oklch(0.904 0.025 91.6);
}Tailwind CSS v4
@theme {
--color-pueblo-white: #e5dfcd;
--color-pueblo-white-50: #f7f5ed;
--color-pueblo-white-100: #eae8df;
--color-pueblo-white-200: #d8d4c9;
--color-pueblo-white-300: #bbb7a9;
--color-pueblo-white-400: #a49e8e;
--color-pueblo-white-500: #8c8674;
--color-pueblo-white-600: #767162;
--color-pueblo-white-700: #5f5b4e;
--color-pueblo-white-800: #464239;
--color-pueblo-white-900: #302e27;
--color-pueblo-white-950: #1c1a15;
}SCSS
$pueblo-white: #e5dfcd;
$pueblo-white-rgb: 229, 223, 205;
$pueblo-white-light: mix(#fff, $pueblo-white, 20%);
$pueblo-white-dark: mix(#000, $pueblo-white, 20%);
.element {
color: $pueblo-white;
box-shadow: 0 0 0 2px rgba($pueblo-white, 0.35);
}