Named color · #B3B299
Alfalfa
Alfalfa is #B3B299: rgb(179 178 153), hsl(58 15% 65%), oklch(0.758 0.035 105.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Alfalfa color name →
#B3B299
oklch(0.758 0.035 105.3)
Color conversions
- HEX
- #b3b299
- RGB
- rgb(179 178 153)
- HSL
- hsl(58 15% 65%)
- HWB
- hwb(58 60% 30%)
- OKLCH
- oklch(0.758 0.035 105.3)
- OKLab
- oklab(0.758 -0.009 0.033)
- CIE Lab
- lab(72.15 -2.86 12.98)
- LCH
- lch(72.15 13.29 102.4)
- CMYK
- cmyk(0% 1% 15% 30%)
Tints · Shades · Tones
Tints
- BAB9A3
- C2C1AD
- C9C9B7
- D1D0C1
- D8D8CB
- E0E0D5
- E8E7E0
- EFEFEA
- F7F7F4
Shades
- 9B9A84
- 848370
- 6E6D5D
- 58574A
- 434338
- 2F2F27
- 1D1D17
- 0C0C08
- 010101
Tones
- AEAD97
- A9A894
- A3A392
- 9E9E8F
- 99998D
- 94948A
- 8F8F88
- 8A8A85
- 858583
Color harmonies
Complementary +180°
- B3B299
Alfalfa
- AEAEC6
≈ Purple Freedom
Analogous -30° +30°
- B3B299
Alfalfa
- BEAE98
≈ Riviera Beach
- A7B6A0
≈ Salvia
Triadic +120° +240°
- B3B299
Alfalfa
- 9AB5C1
≈ Peaceful Blue
- C1A8B5
≈ Pansy Posie
Split-complementary +150° +210°
- B3B299
Alfalfa
- A2B2C7
≈ Aerial View
- B9AAC0
≈ Lavender Frost
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 2.15:1 · APCA Lc 42
Ag
AAAOn black
WCAG 9.74:1 · APCA Lc 60
Best text color: #000000
WCAG 9.74:1 (AAA) · APCA Lc 60
Contrast pairs
Code snippets
CSS
:root {
--alfalfa: #b3b299;
--alfalfa-rgb: 179 178 153;
--alfalfa-oklch: oklch(0.758 0.035 105.3);
}
.element {
color: var(--alfalfa);
background-color: hsl(58 15% 65%);
border-color: oklch(0.758 0.035 105.3);
}Tailwind CSS v4
@theme {
--color-alfalfa: #b3b299;
--color-alfalfa-50: #f6f6eb;
--color-alfalfa-100: #e9e9dc;
--color-alfalfa-200: #d5d6c5;
--color-alfalfa-300: #b9b9a5;
--color-alfalfa-400: #a1a089;
--color-alfalfa-500: #89886d;
--color-alfalfa-600: #74735d;
--color-alfalfa-700: #5d5c4a;
--color-alfalfa-800: #444335;
--color-alfalfa-900: #2f2e24;
--color-alfalfa-950: #1c1b13;
}SCSS
$alfalfa: #b3b299;
$alfalfa-rgb: 179, 178, 153;
$alfalfa-light: mix(#fff, $alfalfa, 20%);
$alfalfa-dark: mix(#000, $alfalfa, 20%);
.element {
color: $alfalfa;
box-shadow: 0 0 0 2px rgba($alfalfa, 0.35);
}