Black

#0A2916

Green

Color Codes

All color formats for development

HEX
#0A2916
RGB
rgb(10, 41, 22)
HSL
hsl(143, 61%, 10%)
OKLCH
oklch(0.252 0.051 153.5)
CMYK
cmyk(76%, 0%, 46%, 84%)

Accessibility

WCAG contrast compliance

On White Background

15.65:1

AA AAA

On Black Background

1.34:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F3FC
100
#E2F8
200
#CAF2
300
#A1E8
400
#6FDC
500
#46D2
600
#2CB5
700
#2390
800
#1967
900
#1042
950
#0A29

Shades

Darker variations

1#092514
2#082111
3#071D0F
4#06190D
5#05150B
6#041009
7#030C07
8#020804
9#010402

Tints

Lighter variations

1#134E2A
2#1C733D
3#259851
4#2EBD65
5#46D27C
6#6BDB96
7#90E4B0
8#B5EDCB
9#DAF6E5

Tones

Muted variations

1#0C2716
2#0D2617
3#0F2417
4#102317
5#122118
6#132018
7#151E18
8#161D19
9#181B19

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F3FC
#F3FCF6
BackgroundsSubtle highlightsCard backgrounds
100
E2F8
#E2F8EB
Light backgroundsTable row hoverSkeleton loading
200
CAF2
#CAF2D9
Secondary backgroundsInput backgroundsDividers
300
A1E8
#A1E8BC
BordersInactive statesPlaceholder text
400
6FDC
#6FDC99
Disabled statesSecondary iconsMuted text
500
46D2
#46D27C
Primary brand colorCTAsActive elementsLinks
600
2CB5
#2CB560
Hover statesFocus ringsPrimary buttons hover
700
2390
#23904D
Active/pressed statesDark mode accentsSecondary text
800
1967
#196737
Text on light backgroundsHeadingsStrong borders
900
1042
#104223
Primary textHigh emphasis contentDark headings
950
0A29
#0A2916
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --black-50: #F3FCF6;
  --black-100: #E2F8EB;
  --black-200: #CAF2D9;
  --black-300: #A1E8BC;
  --black-400: #6FDC99;
  --black-500: #46D27C;
  --black-600: #2CB560;
  --black-700: #23904D;
  --black-800: #196737;
  --black-900: #104223;
  --black-950: #0A2916;
}
Generate More ShadesCreate PaletteConvert Color