Gradient Page

#FAF0E6

#FAF0E6 is the HEX color code for
Linen
#FAF0E6

Linen

Contrast
Light
Luminance
95%
Color Conversions
Formats for Linen (#FAF0E6) in various color spaces.
#FAF0E6
250, 240, 230
30°, 67%, 94%
0%, 4%, 8%, 2%
0.96, 0.017, 67.6
--color-linen: #FAF0E6;

Shades & Tints

#fbf2ea
#f2d9bf
#eabf95
#e2a66a
#d98c3f
#c07326
#95591d
#6a4015
#40260d
#150d04
DarkestBaseLightest

Color Harmonies

Complementary

#FAF0E6
#e5f0fa

Analogous

#fae5e5
#FAF0E6
#fafae5

Triadic

#FAF0E6
#e5faf0
#f0e5fa

Split Complementary

#FAF0E6
#e5fafa
#e5e5fa

UI Component Examples

See how #FAF0E6 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 {
  /* Linen Base */
  --color-primary: #FAF0E6;
  --color-primary-rgb: 250 240 230;
  --color-primary-hsl: 30 67% 94%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #000000;

  /* Shades */
  --color-primary-50:  #fbf2ea;
  --color-primary-100: #f2d9bf;
  --color-primary-200: #eabf95;
  --color-primary-300: #e2a66a;
  --color-primary-400: #d98c3f;
  --color-primary-500: #c07326;
  --color-primary-600: #95591d;
  --color-primary-700: #6a4015;
  --color-primary-800: #40260d;
  --color-primary-900: #150d04;
}

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
#FAF0E6 Hex Color | Linen sl | UI Color Scheme Generator