Sea Green

#166A44

Green

Color Codes

All color formats for development

HEX
#166A44
RGB
rgb(22, 106, 68)
HSL
hsl(153, 66%, 25%)
OKLCH
oklch(0.466 0.099 158.3)
CMYK
cmyk(79%, 0%, 36%, 58%)

Accessibility

WCAG contrast compliance

On White Background

6.61:1

AA AAA

On Black Background

3.18:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2FC
100
#E1F9
200
#C8F4
300
#9EEB
400
#6BE1
500
#41D8
600
#26BA
700
#1E94
800
#166A
900
#0E44
950
#092A

Shades

Darker variations

1#145F3D
2#115536
3#0F4A30
4#0D3F29
5#0B3522
6#092A1B
7#072014
8#04150E
9#020B07

Tints

Lighter variations

1#1C8A58
2#23A96D
3#29C981
4#41D894
5#60DEA6
6#80E5B8
7#A0EBC9
8#C0F2DB
9#DFF8ED

Tones

Muted variations

1#1A6644
2#1E6143
3#225D43
4#275942
5#2B5542
6#2F5141
7#334C41
8#374841
9#3C4440

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2FC
#F2FCF8
BackgroundsSubtle highlightsCard backgrounds
100
E1F9
#E1F9EE
Light backgroundsTable row hoverSkeleton loading
200
C8F4
#C8F4E0
Secondary backgroundsInput backgroundsDividers
300
9EEB
#9EEBC8
BordersInactive statesPlaceholder text
400
6BE1
#6BE1AC
Disabled statesSecondary iconsMuted text
500
41D8
#41D894
Primary brand colorCTAsActive elementsLinks
600
26BA
#26BA78
Hover statesFocus ringsPrimary buttons hover
700
1E94
#1E945F
Active/pressed statesDark mode accentsSecondary text
800
166A
#166A44
Text on light backgroundsHeadingsStrong borders
900
0E44
#0E442B
Primary textHigh emphasis contentDark headings
950
092A
#092A1B
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sea-green-50: #F2FCF8;
  --sea-green-100: #E1F9EE;
  --sea-green-200: #C8F4E0;
  --sea-green-300: #9EEBC8;
  --sea-green-400: #6BE1AC;
  --sea-green-500: #41D894;
  --sea-green-600: #26BA78;
  --sea-green-700: #1E945F;
  --sea-green-800: #166A44;
  --sea-green-900: #0E442B;
  --sea-green-950: #092A1B;
}
Generate More ShadesCreate PaletteConvert Color