Benannte Farbe · #555337
Avocado Pear
Avocado Pear ist #555337: rgb(85 83 55), hsl(56 21% 27%), oklch(0.436 0.043 104.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Avocado Pear color name →
#555337
oklch(0.436 0.043 104.6)
Farbumrechnungen
- HEX
- #555337
- RGB
- rgb(85 83 55)
- HSL
- hsl(56 21% 27%)
- HWB
- hwb(56 22% 67%)
- OKLCH
- oklch(0.436 0.043 104.6)
- OKLab
- oklab(0.436 -0.011 0.042)
- CIE Lab
- lab(34.91 -2.84 16.76)
- LCH
- lch(34.91 17 99.6)
- CMYK
- cmyk(0% 2% 35% 67%)
Tints · Shades · Tones
Tints
- 646349
- 74735C
- 84836F
- 959482
- A6A596
- B7B6AA
- C9C8BF
- DADAD4
- EDECE9
Shades
- 49472E
- 3D3B26
- 31301E
- 262516
- 1C1B0F
- 111108
- 080803
- 020201
- 000000
Tones
- 59573E
- 5D5C45
- 61604D
- 666554
- 6A695B
- 6E6E62
- 73726A
- 777771
- 7C7B79
Farbharmonien
Komplementär +180°
- 555337
Avocado Pear
- 4F4E69
≈ Pango Black
Analog -30° +30°
- 555337
Avocado Pear
- 604E37
≈ Oak Plank
- 48573F
≈ Heavy Green
Triadisch +120° +240°
- 555337
Avocado Pear
- 375763
≈ Kingfisher
- 634857
≈ Plum Harvest
Geteilt komplementär +150° +210°
- 555337
Avocado Pear
- 415369
≈ Into the Stratosphere
- 5A4B62
≈ Paparazzi
Tetradisch +90° +180° +270°
- 555337
Avocado Pear
- 345959
≈ Depth Charge
- 4F4E69
≈ Pango Black
- 67484A
≈ Chocolate Eclair
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 7.83:1 · APCA Lc 87
Ag
FailAuf Schwarz
WCAG 2.67:1 · APCA Lc 15
Beste Textfarbe: #FFFFFF
WCAG 7.83:1 (AAA) · APCA Lc 87
Contrast pairs
Code-Snippets
CSS
:root {
--avocado-pear: #555337;
--avocado-pear-rgb: 85 83 55;
--avocado-pear-oklch: oklch(0.436 0.043 104.6);
}
.element {
color: var(--avocado-pear);
background-color: hsl(56 21% 27%);
border-color: oklch(0.436 0.043 104.6);
}Tailwind CSS v4
@theme {
--color-avocado-pear: #555337;
--color-avocado-pear-50: #f6f6e8;
--color-avocado-pear-100: #e9e9d9;
--color-avocado-pear-200: #d6d6c1;
--color-avocado-pear-300: #bab9a0;
--color-avocado-pear-400: #a2a083;
--color-avocado-pear-500: #8a8867;
--color-avocado-pear-600: #757358;
--color-avocado-pear-700: #5e5c46;
--color-avocado-pear-800: #454332;
--color-avocado-pear-900: #302e22;
--color-avocado-pear-950: #1c1b11;
}SCSS
$avocado-pear: #555337;
$avocado-pear-rgb: 85, 83, 55;
$avocado-pear-light: mix(#fff, $avocado-pear, 20%);
$avocado-pear-dark: mix(#000, $avocado-pear, 20%);
.element {
color: $avocado-pear;
box-shadow: 0 0 0 2px rgba($avocado-pear, 0.35);
}