Gradient Page

#3C493A

#3C493A is the HEX color code for
Lunar Green
#3C493A

Lunar Green

Contrast
Dark
Luminance
26%
Color Conversions
Formats for Lunar Green (#3C493A) in various color spaces.
#3C493A
60, 73, 58
112°, 11%, 26%
18%, 0%, 21%, 71%
0.389, 0.03, 141.4
--color-lunar-green: #3C493A;

Shades & Tints

#f1f4f1
#d6ddd5
#bac6b8
#9fb09c
#839980
#697f66
#52634f
#3b4739
#232a22
#0c0e0b
DarkestBaseLightest

Color Harmonies

Complementary

#3C493A
#483b4a

Analogous

#444a3b
#3C493A
#3b4a40

Triadic

#3C493A
#3b3d4a
#4a3b3d

Split Complementary

#3C493A
#403b4a
#4a3b44

UI Component Examples

See how #3C493A 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 {
  /* Lunar Green Base */
  --color-primary: #3C493A;
  --color-primary-rgb: 60 73 58;
  --color-primary-hsl: 112 11% 26%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #ffffff;

  /* Shades */
  --color-primary-50:  #f1f4f1;
  --color-primary-100: #d6ddd5;
  --color-primary-200: #bac6b8;
  --color-primary-300: #9fb09c;
  --color-primary-400: #839980;
  --color-primary-500: #697f66;
  --color-primary-600: #52634f;
  --color-primary-700: #3b4739;
  --color-primary-800: #232a22;
  --color-primary-900: #0c0e0b;
}

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
#3C493A Hex Color | Lunar Green sl | UI Color Scheme Generator