Green

#116E13

Green

Color Codes

All color formats for development

HEX
#116E13
RGB
rgb(17, 110, 19)
HSL
hsl(121, 73%, 25%)
OKLCH
oklch(0.469 0.148 142.9)
CMYK
cmyk(85%, 0%, 83%, 57%)

Accessibility

WCAG contrast compliance

On White Background

6.43:1

AA AAA

On Black Background

3.26:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2FD
100
#E0FA
200
#C6F6
300
#9AEF
400
#65E7
500
#38E0
600
#1EC2
700
#189A
800
#116E
900
#0B47
950
#072C

Shades

Darker variations

1#0F6311
2#0E580F
3#0C4D0D
4#0A420B
5#093709
6#072C08
7#052106
8#031604
9#020B02

Tints

Lighter variations

1#168F18
2#1CB01E
3#21D224
4#38E03B
5#5AE55C
6#7BEA7D
7#9CF09D
8#BDF5BE
9#DEFADE

Tones

Muted variations

1#166A17
2#1B651C
3#1F6020
4#245C25
5#285729
6#2D522E
7#324E32
8#364937
9#3B443B

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2FD
#F2FDF2
BackgroundsSubtle highlightsCard backgrounds
100
E0FA
#E0FAE1
Light backgroundsTable row hoverSkeleton loading
200
C6F6
#C6F6C6
Secondary backgroundsInput backgroundsDividers
300
9AEF
#9AEF9B
BordersInactive statesPlaceholder text
400
65E7
#65E767
Disabled statesSecondary iconsMuted text
500
38E0
#38E03B
Primary brand colorCTAsActive elementsLinks
600
1EC2
#1EC221
Hover statesFocus ringsPrimary buttons hover
700
189A
#189A1A
Active/pressed statesDark mode accentsSecondary text
800
116E
#116E13
Text on light backgroundsHeadingsStrong borders
900
0B47
#0B470C
Primary textHigh emphasis contentDark headings
950
072C
#072C08
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --green-50: #F2FDF2;
  --green-100: #E0FAE1;
  --green-200: #C6F6C6;
  --green-300: #9AEF9B;
  --green-400: #65E767;
  --green-500: #38E03B;
  --green-600: #1EC221;
  --green-700: #189A1A;
  --green-800: #116E13;
  --green-900: #0B470C;
  --green-950: #072C08;
}
Generate More ShadesCreate PaletteConvert Color