Nazwany kolor · #E9DDC9
Scrolled Parchment
Scrolled Parchment to #E9DDC9: rgb(233 221 201), hsl(38 42% 85%), oklch(0.902 0.03 80.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Scrolled Parchment color name →
#E9DDC9
oklch(0.902 0.03 80.7)
Konwersje koloru
- HEX
- #e9ddc9
- RGB
- rgb(233 221 201)
- HSL
- hsl(38 42% 85%)
- HWB
- hwb(38 79% 9%)
- OKLCH
- oklch(0.902 0.03 80.7)
- OKLab
- oklab(0.902 0.005 0.029)
- CIE Lab
- lab(88.69 1.81 11.41)
- LCH
- lch(88.69 11.55 81)
- CMYK
- cmyk(0% 5% 14% 9%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- EBE0CE
- EDE4D4
- F0E7D9
- F2EBDE
- F4EEE4
- F6F1E9
- F8F5EF
- FBF8F4
- FDFCFA
Odcienie ciemniejsze
- CBC0AE
- ADA495
- 90887C
- 746E64
- 5A554C
- 413D36
- 292622
- 13110F
- 030202
Tony
- DED3C1
- D3CABA
- C8C0B3
- BEB7AB
- B3ADA4
- A9A49D
- 9E9B95
- 94928E
- 8A8987
Harmonie kolorów
Komplementarna +180°
- E9DDC9
Scrolled Parchment
- D4DFF3
≈ Puffy Cloud
Analogowa -30° +30°
- E9DDC9
Scrolled Parchment
- F0DACD
≈ White Truffle
- DFE1CB
≈ Vintage Beige
Triada +120° +240°
- E9DDC9
Scrolled Parchment
- C9E5E7
≈ Babymoon Blue
- E8D9EB
≈ Pale Grey Magenta
Komplementarna rozszczepiona +150° +210°
- E9DDC9
Scrolled Parchment
- CCE3EF
≈ Niagara Falls
- DEDCF2
≈ Chinese Silver
Tetrada +90° +180° +270°
- E9DDC9
Scrolled Parchment
- CCE5DC
≈ Light Picnic Bay
- D4DFF3
≈ Puffy Cloud
- EFD7E1
≈ Rosa Bonito
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.34:1 · APCA Lc 17
Ag
AAANa czerni
WCAG 15.65:1 · APCA Lc 87
Najlepszy kolor tekstu: #000000
WCAG 15.65:1 (AAA) · APCA Lc 87
Contrast pairs
Fragmenty kodu
CSS
:root {
--scrolled-parchment: #e9ddc9;
--scrolled-parchment-rgb: 233 221 201;
--scrolled-parchment-oklch: oklch(0.902 0.03 80.7);
}
.element {
color: var(--scrolled-parchment);
background-color: hsl(38 42% 85%);
border-color: oklch(0.902 0.03 80.7);
}Tailwind CSS v4
@theme {
--color-scrolled-parchment: #e9ddc9;
--color-scrolled-parchment-50: #f9f5ec;
--color-scrolled-parchment-100: #ede7dd;
--color-scrolled-parchment-200: #dad3c6;
--color-scrolled-parchment-300: #bfb6a7;
--color-scrolled-parchment-400: #a89d8b;
--color-scrolled-parchment-500: #918470;
--color-scrolled-parchment-600: #7a705f;
--color-scrolled-parchment-700: #625a4c;
--color-scrolled-parchment-800: #484137;
--color-scrolled-parchment-900: #322d26;
--color-scrolled-parchment-950: #1e1a14;
}SCSS
$scrolled-parchment: #e9ddc9;
$scrolled-parchment-rgb: 233, 221, 201;
$scrolled-parchment-light: mix(#fff, $scrolled-parchment, 20%);
$scrolled-parchment-dark: mix(#000, $scrolled-parchment, 20%);
.element {
color: $scrolled-parchment;
box-shadow: 0 0 0 2px rgba($scrolled-parchment, 0.35);
}