Nazwany kolor · #E2B66C
English Custard
English Custard to #E2B66C: rgb(226 182 108), hsl(38 67% 65%), oklch(0.8 0.105 79.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · English Custard color name →
#E2B66C
oklch(0.8 0.105 79.4)
Konwersje koloru
- HEX
- #e2b66c
- RGB
- rgb(226 182 108)
- HSL
- hsl(38 67% 65%)
- HWB
- hwb(38 42% 11%)
- OKLCH
- oklch(0.8 0.105 79.4)
- OKLab
- oklab(0.8 0.019 0.104)
- CIE Lab
- lab(76.9 9.98 43.67)
- LCH
- lch(76.9 44.79 77.1)
- CMYK
- cmyk(0% 19% 52% 11%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E5BD7C
- E8C58B
- EBCC9A
- EED3A9
- F1DBB7
- F4E2C6
- F7E9D4
- FAF1E2
- FCF8F1
Odcienie ciemniejsze
- C49E5D
- A8864E
- 8C6F40
- 715932
- 574425
- 3E3019
- 271D0D
- 120C04
- 030200
Tony
- D8B16F
- CEAB73
- C4A675
- BAA178
- B09B7A
- A6967B
- 9D907D
- 938B7E
- 8A857F
Harmonie kolorów
Komplementarna +180°
- E2B66C
English Custard
- 97BFFF
≈ Truesky Gloxym
Analogowa -30° +30°
- E2B66C
English Custard
- F5A980
≈ Sunset Peach
- C2C471
≈ Mélange Green
Triada +120° +240°
- E2B66C
English Custard
- 5DD2D8
≈ Blue Radiance
- DCA8E9
≈ Petal Plush
Komplementarna rozszczepiona +150° +210°
- E2B66C
English Custard
- 6FCBF4
≈ Nevermind Nirvana
- BCB3FE
≈ Greyish Lavender
Tetrada +90° +180° +270°
- E2B66C
English Custard
- 72D4B3
≈ Peppy
- 97BFFF
≈ Truesky Gloxym
- F1A2C8
≈ Elastic Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.88:1 · APCA Lc 36
Ag
AAANa czerni
WCAG 11.14:1 · APCA Lc 67
Najlepszy kolor tekstu: #000000
WCAG 11.14:1 (AAA) · APCA Lc 67
Contrast pairs
Fragmenty kodu
CSS
:root {
--english-custard: #e2b66c;
--english-custard-rgb: 226 182 108;
--english-custard-oklch: oklch(0.8 0.105 79.4);
}
.element {
color: var(--english-custard);
background-color: hsl(38 67% 65%);
border-color: oklch(0.8 0.105 79.4);
}Tailwind CSS v4
@theme {
--color-english-custard: #e2b66c;
--color-english-custard-50: #fff3d4;
--color-english-custard-100: #fae5c1;
--color-english-custard-200: #ebd0a1;
--color-english-custard-300: #d3b278;
--color-english-custard-400: #c09752;
--color-english-custard-500: #ab7d23;
--color-english-custard-600: #906a21;
--color-english-custard-700: #74551a;
--color-english-custard-800: #563d11;
--color-english-custard-900: #3c2a0a;
--color-english-custard-950: #261701;
}SCSS
$english-custard: #e2b66c;
$english-custard-rgb: 226, 182, 108;
$english-custard-light: mix(#fff, $english-custard, 20%);
$english-custard-dark: mix(#000, $english-custard, 20%);
.element {
color: $english-custard;
box-shadow: 0 0 0 2px rgba($english-custard, 0.35);
}