Named color · #F3F9E9
Bean Sprout
Bean Sprout is #F3F9E9: rgb(243 249 233), hsl(83 57% 95%), oklch(0.973 0.022 123.6). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Bean Sprout color name →
#F3F9E9
oklch(0.973 0.022 123.6)
Color conversions
- HEX
- #f3f9e9
- RGB
- rgb(243 249 233)
- HSL
- hsl(83 57% 95%)
- HWB
- hwb(83 91% 2%)
- OKLCH
- oklch(0.973 0.022 123.6)
- OKLab
- oklab(0.973 -0.012 0.018)
- CIE Lab
- lab(97.14 -4.13 6.98)
- LCH
- lch(97.14 8.11 120.6)
- CMYK
- cmyk(2% 0% 6% 2%)
Tints · Shades · Tones
Tints
- F4FAEB
- F5FAED
- F7FBF0
- F8FBF2
- F9FCF4
- FAFDF6
- FBFDF8
- FDFEFB
- FEFEFD
Shades
- D3D9CB
- B4B9AD
- 979A90
- 7A7D74
- 5E615A
- 444641
- 2B2C29
- 141513
- 030303
Tones
- E7ECDE
- DBE0D3
- CFD3C8
- C3C7BE
- B8BBB3
- ACAFA9
- A1A39E
- 969794
- 8B8B8A
Color harmonies
Complementary +180°
- F3F9E9
Bean Sprout
- F8F4FF
≈ Sugar Crystal
Analogous -30° +30°
- F3F9E9
Bean Sprout
- FBF6E6
≈ Fragrant Jasmine
- ECFBEF
≈ Spring White
Triadic +120° +240°
- F3F9E9
Bean Sprout
- EFF8FF
≈ Alice Blue
- FFF3F5
≈ Glimpse of Pink
Split-complementary +150° +210°
- F3F9E9
Bean Sprout
- F3F6FF
≈ Mā White
- FFF2FC
≈ Pinkish White
Tetradic +90° +180° +270°
- F3F9E9
Bean Sprout
- E7FAFF
≈ Calm Waters
- F8F4FF
≈ Sugar Crystal
- FFF3F0
≈ Soft Peach Mist
Contrast & accessibility
Ag
FailOn white
WCAG 1.07:1 · APCA Lc 0
Ag
AAAOn black
WCAG 19.53:1 · APCA Lc 102
Best text color: #000000
WCAG 19.53:1 (AAA) · APCA Lc 102
Contrast pairs
Code snippets
CSS
:root {
--bean-sprout: #f3f9e9;
--bean-sprout-rgb: 243 249 233;
--bean-sprout-oklch: oklch(0.973 0.022 123.6);
}
.element {
color: var(--bean-sprout);
background-color: hsl(83 57% 95%);
border-color: oklch(0.973 0.022 123.6);
}Tailwind CSS v4
@theme {
--color-bean-sprout: #f3f9e9;
--color-bean-sprout-50: #f3f6f0;
--color-bean-sprout-100: #e6e9e1;
--color-bean-sprout-200: #d2d6cc;
--color-bean-sprout-300: #b4baae;
--color-bean-sprout-400: #9ca193;
--color-bean-sprout-500: #838979;
--color-bean-sprout-600: #6f7467;
--color-bean-sprout-700: #595d52;
--color-bean-sprout-800: #41443b;
--color-bean-sprout-900: #2d2f29;
--color-bean-sprout-950: #1a1b17;
}SCSS
$bean-sprout: #f3f9e9;
$bean-sprout-rgb: 243, 249, 233;
$bean-sprout-light: mix(#fff, $bean-sprout, 20%);
$bean-sprout-dark: mix(#000, $bean-sprout, 20%);
.element {
color: $bean-sprout;
box-shadow: 0 0 0 2px rgba($bean-sprout, 0.35);
}