Benannte Farbe · #E4B095
Hush Puppy
Hush Puppy ist #E4B095: rgb(228 176 149), hsl(21 59% 74%), oklch(0.798 0.071 48.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Hush Puppy color name →
#E4B095
oklch(0.798 0.071 48.7)
Farbumrechnungen
- HEX
- #e4b095
- RGB
- rgb(228 176 149)
- HSL
- hsl(21 59% 74%)
- HWB
- hwb(21 58% 11%)
- OKLCH
- oklch(0.798 0.071 48.7)
- OKLab
- oklab(0.798 0.047 0.054)
- CIE Lab
- lab(76.2 16.89 21.55)
- LCH
- lch(76.2 27.38 51.9)
- CMYK
- cmyk(0% 23% 35% 11%)
Tints · Shades · Tones
Tints
- E7B89F
- EAC0AA
- EDC8B4
- F0CFBF
- F3D7CA
- F5DFD4
- F8E7DF
- FAEFE9
- FDF7F4
Shades
- C69981
- A9826D
- 8D6C5A
- 725648
- 584237
- 3F2E26
- 281C16
- 120B08
- 030101
Tones
- DAAB93
- D0A691
- C6A28F
- BB9D8D
- B1988B
- A89389
- 9E8E87
- 948A85
- 8A8582
Farbharmonien
Komplementär +180°
- E4B095
Hush Puppy
- 8CC7E2
≈ Gossamer Threads
Analog -30° +30°
- E4B095
Hush Puppy
- E8ABAB
≈ Hibiscus Petal
- D6B889
≈ Splash of Honey
Triadisch +120° +240°
- E4B095
Hush Puppy
- 8FCCB5
≈ Vile Green
- BBB6E9
≈ Purple Sand
Geteilt komplementär +150° +210°
- E4B095
Hush Puppy
- 84CCCE
≈ White Ultramarine
- A1BFEC
≈ Sky High
Tetradisch +90° +180° +270°
- E4B095
Hush Puppy
- A6C99C
≈ Gingko
- 8CC7E2
≈ Gossamer Threads
- D1AFDB
≈ Whisper of Plum
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.91:1 · APCA Lc 37
Ag
AAAAuf Schwarz
WCAG 10.94:1 · APCA Lc 66
Beste Textfarbe: #000000
WCAG 10.94:1 (AAA) · APCA Lc 66
Contrast pairs
Code-Snippets
CSS
:root {
--hush-puppy: #e4b095;
--hush-puppy-rgb: 228 176 149;
--hush-puppy-oklch: oklch(0.798 0.071 48.7);
}
.element {
color: var(--hush-puppy);
background-color: hsl(21 59% 74%);
border-color: oklch(0.798 0.071 48.7);
}Tailwind CSS v4
@theme {
--color-hush-puppy: #e4b095;
--color-hush-puppy-50: #fff0e3;
--color-hush-puppy-100: #fde2d3;
--color-hush-puppy-200: #eeccb9;
--color-hush-puppy-300: #d6ae97;
--color-hush-puppy-400: #c29279;
--color-hush-puppy-500: #ad785c;
--color-hush-puppy-600: #92664e;
--color-hush-puppy-700: #75513e;
--color-hush-puppy-800: #573b2d;
--color-hush-puppy-900: #3d281e;
--color-hush-puppy-950: #26160e;
}SCSS
$hush-puppy: #e4b095;
$hush-puppy-rgb: 228, 176, 149;
$hush-puppy-light: mix(#fff, $hush-puppy, 20%);
$hush-puppy-dark: mix(#000, $hush-puppy, 20%);
.element {
color: $hush-puppy;
box-shadow: 0 0 0 2px rgba($hush-puppy, 0.35);
}