Named color · #877252
Favourite Fudge
Favourite Fudge is #877252: rgb(135 114 82), hsl(36 24% 43%), oklch(0.564 0.053 77.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Brown mean? → · Favourite Fudge color name →
#877252
oklch(0.564 0.053 77.9)
Color conversions
- HEX
- #877252
- RGB
- rgb(135 114 82)
- HSL
- hsl(36 24% 43%)
- HWB
- hwb(36 32% 47%)
- OKLCH
- oklch(0.564 0.053 77.9)
- OKLab
- oklab(0.564 0.011 0.052)
- CIE Lab
- lab(49.45 4.96 20.99)
- LCH
- lch(49.45 21.56 76.7)
- CMYK
- cmyk(0% 16% 39% 47%)
Tints · Shades · Tones
Tints
- 927F62
- 9E8D73
- AA9A83
- B6A894
- C2B6A6
- CEC4B7
- DAD3C9
- E6E1DB
- F2F0ED
Shades
- 756246
- 63533B
- 51442F
- 413625
- 31281A
- 211B11
- 130E08
- 060402
- 010100
Tones
- 867357
- 86755C
- 857660
- 847865
- 84796A
- 837B6E
- 827C73
- 827D77
- 817F7C
Color harmonies
Complementary +180°
- 877252
Favourite Fudge
- 627795
≈ Rushing River
Analogous -30° +30°
- 877252
Favourite Fudge
- 906C5B
≈ Wild Cattail
- 787854
≈ Green Woodpecker Olive
Triadic +120° +240°
- 877252
Favourite Fudge
- 4F7F81
≈ Nickel Ore Green
- 836C8A
≈ Grey Purple
Split-complementary +150° +210°
- 877252
Favourite Fudge
- 547C8E
≈ Technical Blue
- 737194
≈ Rhythm
Tetradic +90° +180° +270°
- 877252
Favourite Fudge
- 56806F
≈ Frosty Spruce
- 627795
≈ Rushing River
- 8E697B
≈ Plum Dandy
Contrast & accessibility
Ag
AAOn white
WCAG 4.60:1 · APCA Lc 72
Ag
AAOn black
WCAG 4.55:1 · APCA Lc 30
Best text color: #FFFFFF
WCAG 4.60:1 (AA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--favourite-fudge: #877252;
--favourite-fudge-rgb: 135 114 82;
--favourite-fudge-oklch: oklch(0.564 0.053 77.9);
}
.element {
color: var(--favourite-fudge);
background-color: hsl(36 24% 43%);
border-color: oklch(0.564 0.053 77.9);
}Tailwind CSS v4
@theme {
--color-favourite-fudge: #877252;
--color-favourite-fudge-50: #fdf4e5;
--color-favourite-fudge-100: #f1e6d5;
--color-favourite-fudge-200: #e0d2bb;
--color-favourite-fudge-300: #c6b599;
--color-favourite-fudge-400: #b09b7c;
--color-favourite-fudge-500: #9a825e;
--color-favourite-fudge-600: #826e50;
--color-favourite-fudge-700: #685840;
--color-favourite-fudge-800: #4d402e;
--color-favourite-fudge-900: #362c1f;
--color-favourite-fudge-950: #21190f;
}SCSS
$favourite-fudge: #877252;
$favourite-fudge-rgb: 135, 114, 82;
$favourite-fudge-light: mix(#fff, $favourite-fudge, 20%);
$favourite-fudge-dark: mix(#000, $favourite-fudge, 20%);
.element {
color: $favourite-fudge;
box-shadow: 0 0 0 2px rgba($favourite-fudge, 0.35);
}