Sea Green

#0C734E

Green

Color Codes

All color formats for development

HEX
#0C734E
RGB
rgb(12, 115, 78)
HSL
hsl(158, 81%, 25%)
OKLCH
oklch(0.492 0.105 161.7)
CMYK
cmyk(90%, 0%, 32%, 55%)

Accessibility

WCAG contrast compliance

On White Background

5.87:1

AA AAA

On Black Background

3.58:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F1FE
100
#DFFC
200
#C3F9
300
#95F4
400
#5DEE
500
#2FE9
600
#15CB
700
#11A2
800
#0C73
900
#084A
950
#052E

Shades

Darker variations

1#0B6846
2#0A5C3E
3#085136
4#07452F
5#063A27
6#052E1F
7#042317
8#021710
9#010C08

Tints

Lighter variations

1#109665
2#13B97C
3#17DB93
4#2FE9A5
5#52EDB4
6#75F0C3
7#97F4D2
8#BAF8E1
9#DCFBF0

Tones

Muted variations

1#116E4C
2#16694B
3#1C6449
4#215F48
5#265A47
6#2B5445
7#304F44
8#354A43
9#3B4541

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F1FE
#F1FEF9
BackgroundsSubtle highlightsCard backgrounds
100
DFFC
#DFFCF1
Light backgroundsTable row hoverSkeleton loading
200
C3F9
#C3F9E5
Secondary backgroundsInput backgroundsDividers
300
95F4
#95F4D1
BordersInactive statesPlaceholder text
400
5DEE
#5DEEB9
Disabled statesSecondary iconsMuted text
500
2FE9
#2FE9A5
Primary brand colorCTAsActive elementsLinks
600
15CB
#15CB88
Hover statesFocus ringsPrimary buttons hover
700
11A2
#11A26D
Active/pressed statesDark mode accentsSecondary text
800
0C73
#0C734E
Text on light backgroundsHeadingsStrong borders
900
084A
#084A32
Primary textHigh emphasis contentDark headings
950
052E
#052E1F
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sea-green-50: #F1FEF9;
  --sea-green-100: #DFFCF1;
  --sea-green-200: #C3F9E5;
  --sea-green-300: #95F4D1;
  --sea-green-400: #5DEEB9;
  --sea-green-500: #2FE9A5;
  --sea-green-600: #15CB88;
  --sea-green-700: #11A26D;
  --sea-green-800: #0C734E;
  --sea-green-900: #084A32;
  --sea-green-950: #052E1F;
}
Generate More ShadesCreate PaletteConvert Color