Benannte Farbe · #564342
Christmas Pudding
Christmas Pudding ist #564342: rgb(86 67 66), hsl(3 13% 30%), oklch(0.403 0.026 21.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Christmas Pudding color name →
#564342
oklch(0.403 0.026 21.8)
Farbumrechnungen
- HEX
- #564342
- RGB
- rgb(86 67 66)
- HSL
- hsl(3 13% 30%)
- HWB
- hwb(3 26% 66%)
- OKLCH
- oklch(0.403 0.026 21.8)
- OKLab
- oklab(0.403 0.025 0.01)
- CIE Lab
- lab(30.46 8.31 3.89)
- LCH
- lch(30.46 9.18 25.1)
- CMYK
- cmyk(0% 22% 23% 66%)
Tints · Shades · Tones
Tints
- 665453
- 756564
- 867776
- 968988
- A79C9B
- B8AFAE
- C9C2C2
- DBD6D6
- EDEAEA
Shades
- 4A3938
- 3E2F2F
- 322625
- 271D1C
- 1C1414
- 120C0B
- 080505
- 020101
- 000000
Tones
- 5A4948
- 5E4F4E
- 635554
- 675B5A
- 6B6160
- 6F6766
- 736D6D
- 787373
- 7C7A7A
Farbharmonien
Komplementär +180°
- 564342
Christmas Pudding
- 384D4E
≈ Silk Crepe Grey
Analog -30° +30°
- 564342
Christmas Pudding
- 54434A
≈ Grapes of Wrath
- 54453B
≈ Rave Raisin
Triadisch +120° +240°
- 564342
Christmas Pudding
- 414C3F
≈ Foxhall Green
- 414957
≈ Pit Stop
Geteilt komplementär +150° +210°
- 564342
Christmas Pudding
- 3A4D47
≈ Amphitrite
- 3A4B54
≈ New Navy Blue
Tetradisch +90° +180° +270°
- 564342
Christmas Pudding
- 494A3A
≈ Treasure Island
- 384D4E
≈ Silk Crepe Grey
- 484656
≈ Quixotic Plum
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 9.22:1 · APCA Lc 91
Ag
FailAuf Schwarz
WCAG 2.27:1 · APCA Lc 11
Beste Textfarbe: #FFFFFF
WCAG 9.22:1 (AAA) · APCA Lc 91
Contrast pairs
Code-Snippets
CSS
:root {
--christmas-pudding: #564342;
--christmas-pudding-rgb: 86 67 66;
--christmas-pudding-oklch: oklch(0.403 0.026 21.8);
}
.element {
color: var(--christmas-pudding);
background-color: hsl(3 13% 30%);
border-color: oklch(0.403 0.026 21.8);
}Tailwind CSS v4
@theme {
--color-christmas-pudding: #564342;
--color-christmas-pudding-50: #fdf2f1;
--color-christmas-pudding-100: #f1e5e4;
--color-christmas-pudding-200: #dfd0cf;
--color-christmas-pudding-300: #c5b2b1;
--color-christmas-pudding-400: #ae9997;
--color-christmas-pudding-500: #97807e;
--color-christmas-pudding-600: #806c6b;
--color-christmas-pudding-700: #665655;
--color-christmas-pudding-800: #4b3f3f;
--color-christmas-pudding-900: #342b2b;
--color-christmas-pudding-950: #201918;
}SCSS
$christmas-pudding: #564342;
$christmas-pudding-rgb: 86, 67, 66;
$christmas-pudding-light: mix(#fff, $christmas-pudding, 20%);
$christmas-pudding-dark: mix(#000, $christmas-pudding, 20%);
.element {
color: $christmas-pudding;
box-shadow: 0 0 0 2px rgba($christmas-pudding, 0.35);
}