Black

#082B18

Green

Color Codes

All color formats for development

HEX
#082B18
RGB
rgb(8, 43, 24)
HSL
hsl(147, 69%, 10%)
OKLCH
oklch(0.258 0.054 155.6)
CMYK
cmyk(81%, 0%, 44%, 83%)

Accessibility

WCAG contrast compliance

On White Background

15.34:1

AA AAA

On Black Background

1.37:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2FD
100
#E1F9
200
#C7F5
300
#9CED
400
#68E3
500
#3DDB
600
#23BE
700
#1C97
800
#146C
900
#0D45
950
#082B

Shades

Darker variations

1#072715
2#062213
3#061E11
4#051A0E
5#04160C
6#031109
7#020D07
8#020905
9#010402

Tints

Lighter variations

1#0F522D
2#167942
3#1D9F58
4#24C66D
5#3DDB84
6#64E39D
7#8BEAB5
8#B1F1CE
9#D8F8E6

Tones

Muted variations

1#0A2918
2#0B2818
3#0D2618
4#0F2418
5#112219
6#122119
7#141F19
8#161D19
9#181B19

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2FD
#F2FDF7
BackgroundsSubtle highlightsCard backgrounds
100
E1F9
#E1F9EC
Light backgroundsTable row hoverSkeleton loading
200
C7F5
#C7F5DC
Secondary backgroundsInput backgroundsDividers
300
9CED
#9CEDC0
BordersInactive statesPlaceholder text
400
68E3
#68E3A0
Disabled statesSecondary iconsMuted text
500
3DDB
#3DDB84
Primary brand colorCTAsActive elementsLinks
600
23BE
#23BE68
Hover statesFocus ringsPrimary buttons hover
700
1C97
#1C9753
Active/pressed statesDark mode accentsSecondary text
800
146C
#146C3B
Text on light backgroundsHeadingsStrong borders
900
0D45
#0D4526
Primary textHigh emphasis contentDark headings
950
082B
#082B18
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --black-50: #F2FDF7;
  --black-100: #E1F9EC;
  --black-200: #C7F5DC;
  --black-300: #9CEDC0;
  --black-400: #68E3A0;
  --black-500: #3DDB84;
  --black-600: #23BE68;
  --black-700: #1C9753;
  --black-800: #146C3B;
  --black-900: #0D4526;
  --black-950: #082B18;
}
Generate More ShadesCreate PaletteConvert Color