Sea Green

#2FB145

Green

Color Codes

All color formats for development

HEX
#2FB145
RGB
rgb(47, 177, 69)
HSL
hsl(130, 58%, 44%)
OKLCH
oklch(0.669 0.185 145.7)
CMYK
cmyk(73%, 0%, 61%, 31%)

Accessibility

WCAG contrast compliance

On White Background

2.80:1

AA AAA

On Black Background

7.50:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F3FC
100
#E3F8
200
#CBF1
300
#A2E6
400
#72DA
500
#4ACF
600
#2FB1
700
#258D
800
#1B65
900
#1140
950
#0B28

Shades

Darker variations

1#2AA03E
2#268E37
3#217C30
4#1C6A29
5#185922
6#13471C
7#0E3515
8#09230E
9#051207

Tints

Lighter variations

1#35C84E
2#4BCF61
3#61D574
4#78DB88
5#8EE19C
6#A5E7B0
7#BBEDC4
8#D2F3D7
9#E8F9EB

Tones

Muted variations

1#36AB49
2#3CA44D
3#439E52
4#499756
5#50915B
6#568A5F
7#5D8463
8#637D68
9#6A776C

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F3FC
#F3FCF4
BackgroundsSubtle highlightsCard backgrounds
100
E3F8
#E3F8E6
Light backgroundsTable row hoverSkeleton loading
200
CBF1
#CBF1D1
Secondary backgroundsInput backgroundsDividers
300
A2E6
#A2E6AE
BordersInactive statesPlaceholder text
400
72DA
#72DA83
Disabled statesSecondary iconsMuted text
500
4ACF
#4ACF60
Primary brand colorCTAsActive elementsLinks
600
2FB1
#2FB145
Hover statesFocus ringsPrimary buttons hover
700
258D
#258D37
Active/pressed statesDark mode accentsSecondary text
800
1B65
#1B6527
Text on light backgroundsHeadingsStrong borders
900
1140
#114019
Primary textHigh emphasis contentDark headings
950
0B28
#0B2810
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sea-green-50: #F3FCF4;
  --sea-green-100: #E3F8E6;
  --sea-green-200: #CBF1D1;
  --sea-green-300: #A2E6AE;
  --sea-green-400: #72DA83;
  --sea-green-500: #4ACF60;
  --sea-green-600: #2FB145;
  --sea-green-700: #258D37;
  --sea-green-800: #1B6527;
  --sea-green-900: #114019;
  --sea-green-950: #0B2810;
}
Generate More ShadesCreate PaletteConvert Color