Black

#082B16

Green

Color Codes

All color formats for development

HEX
#082B16
RGB
rgb(8, 43, 22)
HSL
hsl(144, 69%, 10%)
OKLCH
oklch(0.258 0.056 153.3)
CMYK
cmyk(81%, 0%, 49%, 83%)

Accessibility

WCAG contrast compliance

On White Background

15.36: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#072714
2#062212
3#061E0F
4#051A0D
5#04160B
6#031109
7#020D07
8#020904
9#010402

Tints

Lighter variations

1#0F522A
2#16793E
3#1D9F51
4#24C665
5#3DDB7C
6#64E397
7#8BEAB1
8#B1F1CB
9#D8F8E5

Tones

Muted variations

1#0A2916
2#0B2817
3#0D2617
4#0F2417
5#112218
6#122118
7#141F18
8#161D19
9#181B19

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2FD
#F2FDF6
BackgroundsSubtle highlightsCard backgrounds
100
E1F9
#E1F9EB
Light backgroundsTable row hoverSkeleton loading
200
C7F5
#C7F5D9
Secondary backgroundsInput backgroundsDividers
300
9CED
#9CEDBC
BordersInactive statesPlaceholder text
400
68E3
#68E399
Disabled statesSecondary iconsMuted text
500
3DDB
#3DDB7C
Primary brand colorCTAsActive elementsLinks
600
23BE
#23BE61
Hover statesFocus ringsPrimary buttons hover
700
1C97
#1C974D
Active/pressed statesDark mode accentsSecondary text
800
146C
#146C37
Text on light backgroundsHeadingsStrong borders
900
0D45
#0D4523
Primary textHigh emphasis contentDark headings
950
082B
#082B16
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --black-50: #F2FDF6;
  --black-100: #E1F9EB;
  --black-200: #C7F5D9;
  --black-300: #9CEDBC;
  --black-400: #68E399;
  --black-500: #3DDB7C;
  --black-600: #23BE61;
  --black-700: #1C974D;
  --black-800: #146C37;
  --black-900: #0D4523;
  --black-950: #082B16;
}
Generate More ShadesCreate PaletteConvert Color