Benannte Farbe · #C17444
Ginger Root
Ginger Root ist #C17444: rgb(193 116 68), hsl(23 50% 51%), oklch(0.633 0.116 51.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Ginger Root color name →
#C17444
oklch(0.633 0.116 51.2)
Farbumrechnungen
- HEX
- #c17444
- RGB
- rgb(193 116 68)
- HSL
- hsl(23 50% 51%)
- HWB
- hwb(23 27% 24%)
- OKLCH
- oklch(0.633 0.116 51.2)
- OKLab
- oklab(0.633 0.073 0.09)
- CIE Lab
- lab(56.82 27.95 39.52)
- LCH
- lch(56.82 48.4 54.7)
- CMYK
- cmyk(0% 40% 65% 24%)
Tints · Shades · Tones
Tints
- C88258
- CF906A
- D69D7D
- DCAB8F
- E3B9A1
- E9C7B4
- EFD5C6
- F4E3D9
- FAF1EC
Shades
- A7643A
- 8F5430
- 774526
- 5F371D
- 492914
- 341B0C
- 200F05
- 0E0502
- 020100
Tones
- BB764C
- B57753
- AF7959
- A87A5F
- A27C65
- 9C7D6B
- 957E71
- 8E7F76
- 877F7B
Farbharmonien
Komplementär +180°
- C17444
Ginger Root
- 2896C3
≈ Atomic Blue
Analog -30° +30°
- C17444
Ginger Root
- C76C6B
≈ Cuban Plaza
- AE8228
≈ Bronze Leaf
Triadisch +120° +240°
- C17444
Ginger Root
- 21A081
≈ Reptilian Green
- 8B7CCB
≈ Ube
Geteilt komplementär +150° +210°
- C17444
Ginger Root
- 009DA5
≈ Turkish Boy
- 6289D0
≈ Livid
Tetradisch +90° +180° +270°
- C17444
Ginger Root
- 609B58
≈ Savage Garden
- 2896C3
≈ Atomic Blue
- AA72B4
≈ Berry Burst
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.59:1 · APCA Lc 63
Ag
AAAuf Schwarz
WCAG 5.84:1 · APCA Lc 38
Beste Textfarbe: #000000
WCAG 5.84:1 (AA) · APCA Lc 38
Contrast pairs
Code-Snippets
CSS
:root {
--ginger-root: #c17444;
--ginger-root-rgb: 193 116 68;
--ginger-root-oklch: oklch(0.633 0.116 51.2);
}
.element {
color: var(--ginger-root);
background-color: hsl(23 50% 51%);
border-color: oklch(0.633 0.116 51.2);
}Tailwind CSS v4
@theme {
--color-ginger-root: #c17444;
--color-ginger-root-50: #ffedd7;
--color-ginger-root-100: #ffdec5;
--color-ginger-root-200: #fdc7a6;
--color-ginger-root-300: #e7a77f;
--color-ginger-root-400: #d58a5d;
--color-ginger-root-500: #c16d36;
--color-ginger-root-600: #a35d2f;
--color-ginger-root-700: #834a25;
--color-ginger-root-800: #62351b;
--color-ginger-root-900: #452411;
--color-ginger-root-950: #2c1304;
}SCSS
$ginger-root: #c17444;
$ginger-root-rgb: 193, 116, 68;
$ginger-root-light: mix(#fff, $ginger-root, 20%);
$ginger-root-dark: mix(#000, $ginger-root, 20%);
.element {
color: $ginger-root;
box-shadow: 0 0 0 2px rgba($ginger-root, 0.35);
}