Green

#116E11

Green

Color Codes

All color formats for development

HEX
#116E11
RGB
rgb(17, 110, 17)
HSL
hsl(120, 73%, 25%)
OKLCH
oklch(0.469 0.149 142.7)
CMYK
cmyk(85%, 0%, 85%, 57%)

Accessibility

WCAG contrast compliance

On White Background

6.44: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#0F630F
2#0E580E
3#0C4D0C
4#0A420A
5#093709
6#072C07
7#052105
8#031603
9#020B02

Tints

Lighter variations

1#168F16
2#1CB01C
3#21D221
4#38E038
5#5AE55A
6#7BEA7B
7#9CF09C
8#BDF5BD
9#DEFADE

Tones

Muted variations

1#166A16
2#1B651B
3#1F601F
4#245C24
5#285728
6#2D522D
7#324E32
8#364936
9#3B443B

Usage Guidelines

Recommended use cases for each shade level

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

Export Code

Copy ready-to-use code for your project

:root {
  --green-50: #F2FDF2;
  --green-100: #E0FAE0;
  --green-200: #C6F6C6;
  --green-300: #9AEF9A;
  --green-400: #65E765;
  --green-500: #38E038;
  --green-600: #1EC21E;
  --green-700: #189A18;
  --green-800: #116E11;
  --green-900: #0B470B;
  --green-950: #072C07;
}
Generate More ShadesCreate PaletteConvert Color