Sea Green

#2DB44A

Green

Color Codes

All color formats for development

HEX
#2DB44A
RGB
rgb(45, 180, 74)
HSL
hsl(133, 60%, 44%)
OKLCH
oklch(0.677 0.186 146.5)
CMYK
cmyk(75%, 0%, 59%, 29%)

Accessibility

WCAG contrast compliance

On White Background

2.71:1

AA AAA

On Black Background

7.74: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
#70DB
500
#47D1
600
#2DB4
700
#248F
800
#1A66
900
#1041
950
#0A29

Shades

Darker variations

1#28A243
2#24903B
3#1F7E34
4#1B6C2C
5#165A25
6#12481E
7#0D3616
8#09240F
9#041207

Tints

Lighter variations

1#33CA53
2#48D166
3#5FD779
4#76DD8C
5#8DE29F
6#A4E8B2
7#BAEEC6
8#D1F4D9
9#E8F9EC

Tones

Muted variations

1#34AD4E
2#3AA652
3#419F55
4#489959
5#4F925D
6#558B61
7#5C8465
8#637E69
9#69776C

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F3FC
#F3FCF5
BackgroundsSubtle highlightsCard backgrounds
100
E2F8
#E2F8E7
Light backgroundsTable row hoverSkeleton loading
200
CAF2
#CAF2D3
Secondary backgroundsInput backgroundsDividers
300
A1E8
#A1E8B0
BordersInactive statesPlaceholder text
400
70DB
#70DB87
Disabled statesSecondary iconsMuted text
500
47D1
#47D165
Primary brand colorCTAsActive elementsLinks
600
2DB4
#2DB44A
Hover statesFocus ringsPrimary buttons hover
700
248F
#248F3B
Active/pressed statesDark mode accentsSecondary text
800
1A66
#1A662A
Text on light backgroundsHeadingsStrong borders
900
1041
#10411B
Primary textHigh emphasis contentDark headings
950
0A29
#0A2911
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sea-green-50: #F3FCF5;
  --sea-green-100: #E2F8E7;
  --sea-green-200: #CAF2D3;
  --sea-green-300: #A1E8B0;
  --sea-green-400: #70DB87;
  --sea-green-500: #47D165;
  --sea-green-600: #2DB44A;
  --sea-green-700: #248F3B;
  --sea-green-800: #1A662A;
  --sea-green-900: #10411B;
  --sea-green-950: #0A2911;
}
Generate More ShadesCreate PaletteConvert Color