Sea Green

#189A53

Green

Color Codes

All color formats for development

HEX
#189A53
RGB
rgb(24, 154, 83)
HSL
hsl(147, 73%, 35%)
OKLCH
oklch(0.604 0.15 152.6)
CMYK
cmyk(84%, 0%, 46%, 40%)

Accessibility

WCAG contrast compliance

On White Background

3.63:1

AA AAA

On Black Background

5.79:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2FD
100
#E0FA
200
#C6F6
300
#9AEF
400
#65E7
500
#38E0
600
#1EC2
700
#189A
800
#116E
900
#0B47
950
#072C

Shades

Darker variations

1#168B4A
2#137C42
3#116C3A
4#0E5D32
5#0C4D29
6#0A3E21
7#072E19
8#051F11
9#020F08

Tints

Lighter variations

1#1DB762
2#21D471
3#36E083
4#53E494
5#70E9A6
6#8CEDB8
7#A9F2CA
8#C6F6DB
9#E2FBED

Tones

Muted variations

1#1F9453
2#258D54
3#2C8755
4#328055
5#397A56
6#3F7357
7#466D57
8#4C6658
9#536059

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2FD
#F2FDF7
BackgroundsSubtle highlightsCard backgrounds
100
E0FA
#E0FAEC
Light backgroundsTable row hoverSkeleton loading
200
C6F6
#C6F6DB
Secondary backgroundsInput backgroundsDividers
300
9AEF
#9AEFC0
BordersInactive statesPlaceholder text
400
65E7
#65E79F
Disabled statesSecondary iconsMuted text
500
38E0
#38E084
Primary brand colorCTAsActive elementsLinks
600
1EC2
#1EC268
Hover statesFocus ringsPrimary buttons hover
700
189A
#189A53
Active/pressed statesDark mode accentsSecondary text
800
116E
#116E3B
Text on light backgroundsHeadingsStrong borders
900
0B47
#0B4726
Primary textHigh emphasis contentDark headings
950
072C
#072C18
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sea-green-50: #F2FDF7;
  --sea-green-100: #E0FAEC;
  --sea-green-200: #C6F6DB;
  --sea-green-300: #9AEFC0;
  --sea-green-400: #65E79F;
  --sea-green-500: #38E084;
  --sea-green-600: #1EC268;
  --sea-green-700: #189A53;
  --sea-green-800: #116E3B;
  --sea-green-900: #0B4726;
  --sea-green-950: #072C18;
}
Generate More ShadesCreate PaletteConvert Color