Sea Green

#189A55

Green

Color Codes

All color formats for development

HEX
#189A55
RGB
rgb(24, 154, 85)
HSL
hsl(148, 73%, 35%)
OKLCH
oklch(0.604 0.148 153.2)
CMYK
cmyk(84%, 0%, 45%, 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#168B4C
2#137C44
3#116C3B
4#0E5D33
5#0C4D2A
6#0A3E22
7#072E19
8#051F11
9#020F08

Tints

Lighter variations

1#1DB765
2#21D474
3#36E085
4#53E497
5#70E9A8
6#8CEDB9
7#A9F2CB
8#C6F6DC
9#E2FBEE

Tones

Muted variations

1#1F9455
2#258D56
3#2C8756
4#328057
5#397A57
6#3F7358
7#466D58
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
#C6F6DC
Secondary backgroundsInput backgroundsDividers
300
9AEF
#9AEFC1
BordersInactive statesPlaceholder text
400
65E7
#65E7A1
Disabled statesSecondary iconsMuted text
500
38E0
#38E087
Primary brand colorCTAsActive elementsLinks
600
1EC2
#1EC26B
Hover statesFocus ringsPrimary buttons hover
700
189A
#189A55
Active/pressed statesDark mode accentsSecondary text
800
116E
#116E3D
Text on light backgroundsHeadingsStrong borders
900
0B47
#0B4727
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: #C6F6DC;
  --sea-green-300: #9AEFC1;
  --sea-green-400: #65E7A1;
  --sea-green-500: #38E087;
  --sea-green-600: #1EC26B;
  --sea-green-700: #189A55;
  --sea-green-800: #116E3D;
  --sea-green-900: #0B4727;
  --sea-green-950: #072C18;
}
Generate More ShadesCreate PaletteConvert Color