Black

#082B19

Green

Color Codes

All color formats for development

HEX
#082B19
RGB
rgb(8, 43, 25)
HSL
hsl(149, 69%, 10%)
OKLCH
oklch(0.258 0.053 156.9)
CMYK
cmyk(81%, 0%, 42%, 83%)

Accessibility

WCAG contrast compliance

On White Background

15.33: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#072716
2#062214
3#061E11
4#051A0F
5#04160C
6#03110A
7#020D07
8#020905
9#010402

Tints

Lighter variations

1#0F522F
2#167946
3#1D9F5C
4#24C673
5#3DDB8A
6#64E3A1
7#8BEAB9
8#B1F1D0
9#D8F8E8

Tones

Muted variations

1#0A2919
2#0B2819
3#0D2619
4#0F2419
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
#E1F9ED
Light backgroundsTable row hoverSkeleton loading
200
C7F5
#C7F5DD
Secondary backgroundsInput backgroundsDividers
300
9CED
#9CEDC3
BordersInactive statesPlaceholder text
400
68E3
#68E3A4
Disabled statesSecondary iconsMuted text
500
3DDB
#3DDB8A
Primary brand colorCTAsActive elementsLinks
600
23BE
#23BE6E
Hover statesFocus ringsPrimary buttons hover
700
1C97
#1C9757
Active/pressed statesDark mode accentsSecondary text
800
146C
#146C3E
Text on light backgroundsHeadingsStrong borders
900
0D45
#0D4528
Primary textHigh emphasis contentDark headings
950
082B
#082B19
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --black-50: #F2FDF7;
  --black-100: #E1F9ED;
  --black-200: #C7F5DD;
  --black-300: #9CEDC3;
  --black-400: #68E3A4;
  --black-500: #3DDB8A;
  --black-600: #23BE6E;
  --black-700: #1C9757;
  --black-800: #146C3E;
  --black-900: #0D4528;
  --black-950: #082B19;
}
Generate More ShadesCreate PaletteConvert Color