Green

#116E14

Green

Color Codes

All color formats for development

HEX
#116E14
RGB
rgb(17, 110, 20)
HSL
hsl(122, 73%, 25%)
OKLCH
oklch(0.47 0.148 143.1)
CMYK
cmyk(85%, 0%, 82%, 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#0F6312
2#0E5810
3#0C4D0E
4#0A420C
5#09370A
6#072C08
7#052106
8#031604
9#020B02

Tints

Lighter variations

1#168F1A
2#1CB021
3#21D227
4#38E03E
5#5AE55E
6#7BEA7E
7#9CF09F
8#BDF5BF
9#DEFADF

Tones

Muted variations

1#166A19
2#1B651D
3#1F6021
4#245C26
5#28572A
6#2D522E
7#324E33
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
#C6F6C7
Secondary backgroundsInput backgroundsDividers
300
9AEF
#9AEF9C
BordersInactive statesPlaceholder text
400
65E7
#65E769
Disabled statesSecondary iconsMuted text
500
38E0
#38E03E
Primary brand colorCTAsActive elementsLinks
600
1EC2
#1EC224
Hover statesFocus ringsPrimary buttons hover
700
189A
#189A1C
Active/pressed statesDark mode accentsSecondary text
800
116E
#116E14
Text on light backgroundsHeadingsStrong borders
900
0B47
#0B470D
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: #C6F6C7;
  --green-300: #9AEF9C;
  --green-400: #65E769;
  --green-500: #38E03E;
  --green-600: #1EC224;
  --green-700: #189A1C;
  --green-800: #116E14;
  --green-900: #0B470D;
  --green-950: #072C08;
}
Generate More ShadesCreate PaletteConvert Color