Gradient Page

#C0D8B6

#C0D8B6 is the HEX color code for
Pixie Green
#C0D8B6

Pixie Green

Contrast
Light
Luminance
80%
Color Conversions
Formats for Pixie Green (#C0D8B6) in various color spaces.
#C0D8B6
192, 216, 182
102°, 30%, 78%
11%, 0%, 16%, 15%
0.855, 0.053, 136.5
--color-pixie-green: #C0D8B6;

Shades & Tints

#f1f6ee
#d4e4cd
#b8d2ac
#9bc18b
#7eaf6a
#659550
#4f743e
#38532d
#22321b
#0b1109
DarkestBaseLightest

Color Harmonies

Complementary

#C0D8B6
#ceb6d8

Analogous

#d1d8b6
#C0D8B6
#b6d8bd

Triadic

#C0D8B6
#b6c0d8
#d8b6c0

Split Complementary

#C0D8B6
#bdb6d8
#d8b6d1

UI Component Examples

See how #C0D8B6 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 {
  /* Pixie Green Base */
  --color-primary: #C0D8B6;
  --color-primary-rgb: 192 216 182;
  --color-primary-hsl: 102 30% 78%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #000000;

  /* Shades */
  --color-primary-50:  #f1f6ee;
  --color-primary-100: #d4e4cd;
  --color-primary-200: #b8d2ac;
  --color-primary-300: #9bc18b;
  --color-primary-400: #7eaf6a;
  --color-primary-500: #659550;
  --color-primary-600: #4f743e;
  --color-primary-700: #38532d;
  --color-primary-800: #22321b;
  --color-primary-900: #0b1109;
}

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
#C0D8B6 Hex Color | Pixie Green sl | UI Color Scheme Generator