Gradient Page

#F8F6F1

#F8F6F1 is the HEX color code for
Spring Wood
#F8F6F1

Spring Wood

Contrast
Light
Luminance
96%
Color Conversions
Formats for Spring Wood (#F8F6F1) in various color spaces.
#F8F6F1
248, 246, 241
43°, 33%, 96%
0%, 1%, 3%, 3%
0.973, 0.007, 88.6
--color-spring-wood: #F8F6F1;

Shades & Tints

#f6f4ee
#e5decc
#d4c8aa
#c3b388
#b29d66
#99834d
#77663c
#55492b
#332c1a
#110f09
DarkestBaseLightest

Color Harmonies

Complementary

#F8F6F1
#f1f3f8

Analogous

#f8f3f1
#F8F6F1
#f7f8f1

Triadic

#F8F6F1
#f1f8f6
#f6f1f8

Split Complementary

#F8F6F1
#f1f7f8
#f3f1f8

UI Component Examples

See how #F8F6F1 looks when applied to real interface components.

Interactive Elements
Surface & Accent
Pro Tip!

Use lighter tints for backgrounds to maintain readability while keeping brand identity.

Status Indicator
Active
# CSS Variables
Copy-paste these variables into your global CSS to use this palette instantly.
:root {
  /* Spring Wood Base */
  --color-primary: #F8F6F1;
  --color-primary-rgb: 248 246 241;
  --color-primary-hsl: 43 33% 96%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #000000;

  /* Shades */
  --color-primary-50:  #f6f4ee;
  --color-primary-100: #e5decc;
  --color-primary-200: #d4c8aa;
  --color-primary-300: #c3b388;
  --color-primary-400: #b29d66;
  --color-primary-500: #99834d;
  --color-primary-600: #77663c;
  --color-primary-700: #55492b;
  --color-primary-800: #332c1a;
  --color-primary-900: #110f09;
}

Want more?

We hope you enjoyed this color. Keep reading for more amazing colorful content for developers, designers and creators!
View our entire collection of UI gradientsView all our color names
#F8F6F1 Hex Color | Spring Wood sl | UI Color Scheme Generator