Sea Green

#219148

Green

Color Codes

All color formats for development

HEX
#219148
RGB
rgb(33, 145, 72)
HSL
hsl(141, 63%, 35%)
OKLCH
oklch(0.579 0.146 150)
CMYK
cmyk(77%, 0%, 50%, 43%)

Accessibility

WCAG contrast compliance

On White Background

4.03:1

AA AAA

On Black Background

5.21:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F3FC
100
#E2F8
200
#C9F3
300
#9FE9
400
#6EDE
500
#44D5
600
#2AB7
700
#2191
800
#1868
900
#0F43
950
#092A

Shades

Darker variations

1#1E8341
2#1A743A
3#176633
4#14572B
5#114924
6#0D3A1D
7#0A2C16
8#071D0E
9#030F07

Tints

Lighter variations

1#27AC56
2#2DC863
3#42D475
4#5DDA89
5#78E09C
6#93E6B0
7#AEEDC4
8#C9F3D8
9#E4F9EB

Tones

Muted variations

1#278C4A
2#2C864C
3#32814D
4#387B4F
5#3D7551
6#437053
7#486A54
8#4E6456
9#545F58

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F3FC
#F3FCF6
BackgroundsSubtle highlightsCard backgrounds
100
E2F8
#E2F8EA
Light backgroundsTable row hoverSkeleton loading
200
C9F3
#C9F3D8
Secondary backgroundsInput backgroundsDividers
300
9FE9
#9FE9B9
BordersInactive statesPlaceholder text
400
6EDE
#6EDE95
Disabled statesSecondary iconsMuted text
500
44D5
#44D577
Primary brand colorCTAsActive elementsLinks
600
2AB7
#2AB75B
Hover statesFocus ringsPrimary buttons hover
700
2191
#219148
Active/pressed statesDark mode accentsSecondary text
800
1868
#186834
Text on light backgroundsHeadingsStrong borders
900
0F43
#0F4321
Primary textHigh emphasis contentDark headings
950
092A
#092A15
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sea-green-50: #F3FCF6;
  --sea-green-100: #E2F8EA;
  --sea-green-200: #C9F3D8;
  --sea-green-300: #9FE9B9;
  --sea-green-400: #6EDE95;
  --sea-green-500: #44D577;
  --sea-green-600: #2AB75B;
  --sea-green-700: #219148;
  --sea-green-800: #186834;
  --sea-green-900: #0F4321;
  --sea-green-950: #092A15;
}
Generate More ShadesCreate PaletteConvert Color