Benannte Farbe · #E3C8AA
Craft Juggler
Craft Juggler ist #E3C8AA: rgb(227 200 170), hsl(32 50% 78%), oklch(0.848 0.051 70). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Craft Juggler color name →
#E3C8AA
oklch(0.848 0.051 70)
Farbumrechnungen
- HEX
- #e3c8aa
- RGB
- rgb(227 200 170)
- HSL
- hsl(32 50% 78%)
- HWB
- hwb(32 67% 11%)
- OKLCH
- oklch(0.848 0.051 70)
- OKLab
- oklab(0.848 0.017 0.047)
- CIE Lab
- lab(82.34 6.48 18.74)
- LCH
- lch(82.34 19.83 70.9)
- CMYK
- cmyk(0% 12% 25% 11%)
Tints · Shades · Tones
Tints
- E6CDB2
- E9D3BB
- ECD8C3
- EEDECC
- F1E3D4
- F4E9DD
- F7EEE5
- FAF4EE
- FCF9F6
Shades
- C5AE93
- A8947D
- 8C7B68
- 716353
- 574C3F
- 3F362D
- 27211B
- 120F0B
- 030201
Tones
- D9C1A6
- CFB9A2
- C4B29E
- BAAB99
- B0A395
- A79C91
- 9D958D
- 938E88
- 898784
Farbharmonien
Komplementär +180°
- E3C8AA
Craft Juggler
- B5D0EE
≈ Frost Fairy
Analog -30° +30°
- E3C8AA
Craft Juggler
- EBC3B5
≈ Mellow Marrow
- D4CEA9
≈ Crystal Palace
Triadisch +120° +240°
- E3C8AA
Craft Juggler
- A8D8D4
≈ Brilliante
- D7C4E6
≈ Foggy Love
Geteilt komplementär +150° +210°
- E3C8AA
Craft Juggler
- A9D5E4
≈ Longitude
- C6CAEE
≈ Miami White
Tetradisch +90° +180° +270°
- E3C8AA
Craft Juggler
- B1D8C2
≈ Mint Gala
- B5D0EE
≈ Frost Fairy
- E5C1D8
≈ Dog Rose
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.60:1 · APCA Lc 27
Ag
AAAAuf Schwarz
WCAG 13.10:1 · APCA Lc 76
Beste Textfarbe: #000000
WCAG 13.10:1 (AAA) · APCA Lc 76
Contrast pairs
Code-Snippets
CSS
:root {
--craft-juggler: #e3c8aa;
--craft-juggler-rgb: 227 200 170;
--craft-juggler-oklch: oklch(0.848 0.051 70);
}
.element {
color: var(--craft-juggler);
background-color: hsl(32 50% 78%);
border-color: oklch(0.848 0.051 70);
}Tailwind CSS v4
@theme {
--color-craft-juggler: #e3c8aa;
--color-craft-juggler-50: #fff3e6;
--color-craft-juggler-100: #f3e6d6;
--color-craft-juggler-200: #e2d1bd;
--color-craft-juggler-300: #c8b49c;
--color-craft-juggler-400: #b29a7e;
--color-craft-juggler-500: #9c8162;
--color-craft-juggler-600: #846d53;
--color-craft-juggler-700: #6a5742;
--color-craft-juggler-800: #4e3f30;
--color-craft-juggler-900: #362c20;
--color-craft-juggler-950: #211910;
}SCSS
$craft-juggler: #e3c8aa;
$craft-juggler-rgb: 227, 200, 170;
$craft-juggler-light: mix(#fff, $craft-juggler, 20%);
$craft-juggler-dark: mix(#000, $craft-juggler, 20%);
.element {
color: $craft-juggler;
box-shadow: 0 0 0 2px rgba($craft-juggler, 0.35);
}