Gradient Page

#B6D3BF

#B6D3BF is the HEX color code for
Gum Leaf
#B6D3BF

Gum Leaf

Contrast
Light
Luminance
78%
Color Conversions
Formats for Gum Leaf (#B6D3BF) in various color spaces.
#B6D3BF
182, 211, 191
139°, 25%, 77%
14%, 0%, 9%, 17%
0.84, 0.042, 155.3
--color-gum-leaf: #B6D3BF;

Shades & Tints

#eff5f1
#cfe2d5
#afcfb9
#8fbc9e
#70a982
#568f68
#437051
#30503a
#1d3023
#0a100c
DarkestBaseLightest

Color Harmonies

Complementary

#B6D3BF
#d3b6ca

Analogous

#bbd3b6
#B6D3BF
#b6d3ce

Triadic

#B6D3BF
#bfb6d3
#d3bfb6

Split Complementary

#B6D3BF
#ceb6d3
#d3b6bb

UI Component Examples

See how #B6D3BF 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 {
  /* Gum Leaf Base */
  --color-primary: #B6D3BF;
  --color-primary-rgb: 182 211 191;
  --color-primary-hsl: 139 25% 77%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #000000;

  /* Shades */
  --color-primary-50:  #eff5f1;
  --color-primary-100: #cfe2d5;
  --color-primary-200: #afcfb9;
  --color-primary-300: #8fbc9e;
  --color-primary-400: #70a982;
  --color-primary-500: #568f68;
  --color-primary-600: #437051;
  --color-primary-700: #30503a;
  --color-primary-800: #1d3023;
  --color-primary-900: #0a100c;
}

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
#B6D3BF Hex Color | Gum Leaf sl | UI Color Scheme Generator