Green

#0E4316

Green

Color Codes

All color formats for development

HEX
#0E4316
RGB
rgb(14, 67, 22)
HSL
hsl(129, 65%, 16%)
OKLCH
oklch(0.337 0.092 145.5)
CMYK
cmyk(79%, 0%, 67%, 74%)

Accessibility

WCAG contrast compliance

On White Background

11.46:1

AA AAA

On Black Background

1.83:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2FC
100
#E2F9
200
#C8F3
300
#9EEA
400
#6CE0
500
#42D7
600
#27B9
700
#1F93
800
#1669
900
#0E43
950
#092A

Shades

Darker variations

1#0D3D14
2#0B3612
3#0A2F10
4#09280D
5#07220B
6#061B09
7#041407
8#030D04
9#010702

Tints

Lighter variations

1#166722
2#1D8A2E
3#25AD39
4#2CD145
5#4EDA63
6#72E182
7#95E9A2
8#B8F0C1
9#DCF8E0

Tones

Muted variations

1#114118
2#143E1A
3#163B1C
4#19391E
5#1C3620
6#1E3321
7#213123
8#232E25
9#262B27

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2FC
#F2FCF4
BackgroundsSubtle highlightsCard backgrounds
100
E2F9
#E2F9E5
Light backgroundsTable row hoverSkeleton loading
200
C8F3
#C8F3CF
Secondary backgroundsInput backgroundsDividers
300
9EEA
#9EEAAA
BordersInactive statesPlaceholder text
400
6CE0
#6CE07D
Disabled statesSecondary iconsMuted text
500
42D7
#42D758
Primary brand colorCTAsActive elementsLinks
600
27B9
#27B93D
Hover statesFocus ringsPrimary buttons hover
700
1F93
#1F9331
Active/pressed statesDark mode accentsSecondary text
800
1669
#166923
Text on light backgroundsHeadingsStrong borders
900
0E43
#0E4316
Primary textHigh emphasis contentDark headings
950
092A
#092A0E
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --green-50: #F2FCF4;
  --green-100: #E2F9E5;
  --green-200: #C8F3CF;
  --green-300: #9EEAAA;
  --green-400: #6CE07D;
  --green-500: #42D758;
  --green-600: #27B93D;
  --green-700: #1F9331;
  --green-800: #166923;
  --green-900: #0E4316;
  --green-950: #092A0E;
}
Generate More ShadesCreate PaletteConvert Color