Sea Green

#27B95D

Green

Color Codes

All color formats for development

HEX
#27B95D
RGB
rgb(39, 185, 93)
HSL
hsl(142, 65%, 44%)
OKLCH
oklch(0.692 0.177 150.3)
CMYK
cmyk(79%, 0%, 50%, 27%)

Accessibility

WCAG contrast compliance

On White Background

2.57:1

AA AAA

On Black Background

8.18:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2FC
100
#E2F9
200
#C8F3
300
#9EEA
400
#6CE0
500
#42D7
600
#27B9
700
#1F93
800
#1669
900
#0E43
950
#092A

Shades

Darker variations

1#23A753
2#1F944A
3#1B8241
4#186F38
5#145D2E
6#104A25
7#0C381C
8#082513
9#041309

Tints

Lighter variations

1#2CD169
2#43D779
3#5ADC8A
4#72E19A
5#89E6AB
6#A1EBBC
7#B8F0CD
8#D0F5DD
9#E7FAEE

Tones

Muted variations

1#2FB25F
2#36AB61
3#3DA363
4#449C65
5#4C9566
6#538D68
7#5A866A
8#627F6C
9#69776E

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2FC
#F2FCF6
BackgroundsSubtle highlightsCard backgrounds
100
E2F9
#E2F9EA
Light backgroundsTable row hoverSkeleton loading
200
C8F3
#C8F3D8
Secondary backgroundsInput backgroundsDividers
300
9EEA
#9EEABA
BordersInactive statesPlaceholder text
400
6CE0
#6CE096
Disabled statesSecondary iconsMuted text
500
42D7
#42D778
Primary brand colorCTAsActive elementsLinks
600
27B9
#27B95D
Hover statesFocus ringsPrimary buttons hover
700
1F93
#1F934A
Active/pressed statesDark mode accentsSecondary text
800
1669
#166935
Text on light backgroundsHeadingsStrong borders
900
0E43
#0E4322
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: #F2FCF6;
  --sea-green-100: #E2F9EA;
  --sea-green-200: #C8F3D8;
  --sea-green-300: #9EEABA;
  --sea-green-400: #6CE096;
  --sea-green-500: #42D778;
  --sea-green-600: #27B95D;
  --sea-green-700: #1F934A;
  --sea-green-800: #166935;
  --sea-green-900: #0E4322;
  --sea-green-950: #092A15;
}
Generate More ShadesCreate PaletteConvert Color