Gradient Page

#F9F8E4

#F9F8E4 is the HEX color code for
Rum Swizzle
#F9F8E4

Rum Swizzle

Contrast
Light
Luminance
96%
Color Conversions
Formats for Rum Swizzle (#F9F8E4) in various color spaces.
#F9F8E4
249, 248, 228
57°, 64%, 94%
0%, 0%, 8%, 2%
0.975, 0.026, 104.5
--color-rum-swizzle: #F9F8E4;

Shades & Tints

#fafaea
#f1efc0
#e8e496
#dfd96d
#d6ce43
#bcb529
#928d20
#696417
#3f3c0e
#151405
DarkestBaseLightest

Color Harmonies

Complementary

#F9F8E4
#e6e7f9

Analogous

#f9efe6
#F9F8E4
#f1f9e6

Triadic

#F9F8E4
#e6f9f9
#f9e6f9

Split Complementary

#F9F8E4
#e6f1f9
#efe6f9

UI Component Examples

See how #F9F8E4 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 {
  /* Rum Swizzle Base */
  --color-primary: #F9F8E4;
  --color-primary-rgb: 249 248 228;
  --color-primary-hsl: 57 64% 94%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #000000;

  /* Shades */
  --color-primary-50:  #fafaea;
  --color-primary-100: #f1efc0;
  --color-primary-200: #e8e496;
  --color-primary-300: #dfd96d;
  --color-primary-400: #d6ce43;
  --color-primary-500: #bcb529;
  --color-primary-600: #928d20;
  --color-primary-700: #696417;
  --color-primary-800: #3f3c0e;
  --color-primary-900: #151405;
}

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
#F9F8E4 Hex Color | Rum Swizzle sl | UI Color Scheme Generator