Gradient Page

#7C881A

#7C881A is the HEX color code for
Trendy Green
#7C881A

Trendy Green

Contrast
Dark
Luminance
47%
Color Conversions
Formats for Trendy Green (#7C881A) in various color spaces.
#7C881A
124, 136, 26
67°, 68%, 32%
9%, 0%, 81%, 47%
0.597, 0.128, 116
--color-trendy-green: #7C881A;

Shades & Tints

#f9fbea
#edf3bf
#e0eb94
#d4e269
#c8da3e
#afc125
#88961d
#616b14
#3a400c
#131504
DarkestBaseLightest

Color Harmonies

Complementary

#7C881A
#271a89

Analogous

#895f1a
#7C881A
#45891a

Triadic

#7C881A
#1a7c89
#891a7c

Split Complementary

#7C881A
#1a4589
#5f1a89

UI Component Examples

See how #7C881A 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 {
  /* Trendy Green Base */
  --color-primary: #7C881A;
  --color-primary-rgb: 124 136 26;
  --color-primary-hsl: 67 68% 32%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #ffffff;

  /* Shades */
  --color-primary-50:  #f9fbea;
  --color-primary-100: #edf3bf;
  --color-primary-200: #e0eb94;
  --color-primary-300: #d4e269;
  --color-primary-400: #c8da3e;
  --color-primary-500: #afc125;
  --color-primary-600: #88961d;
  --color-primary-700: #616b14;
  --color-primary-800: #3a400c;
  --color-primary-900: #131504;
}

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