Sea Green

#146B5A

Cyan

Color Codes

All color formats for development

HEX
#146B5A
RGB
rgb(20, 107, 90)
HSL
hsl(168, 69%, 25%)
OKLCH
oklch(0.474 0.083 175.7)
CMYK
cmyk(81%, 0%, 16%, 58%)

Accessibility

WCAG contrast compliance

On White Background

6.40:1

AA AAA

On Black Background

3.28:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2FD
100
#E1F9
200
#C7F5
300
#9CED
400
#68E3
500
#3DDB
600
#23BE
700
#1C97
800
#146C
900
#0D45
950
#082B

Shades

Darker variations

1#126151
2#105648
3#0E4B3F
4#0C4136
5#0A362D
6#082B24
7#06201B
8#041612
9#020B09

Tints

Lighter variations

1#1A8C75
2#20AC90
3#26CDAB
4#3DDBBC
5#5DE1C7
6#7EE7D2
7#9EEDDD
8#BEF3E9
9#DFF9F4

Tones

Muted variations

1#186758
2#1D6355
3#215F52
4#255A50
5#2A564D
6#2E514A
7#334D48
8#374945
9#3B4442

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2FD
#F2FDFB
BackgroundsSubtle highlightsCard backgrounds
100
E1F9
#E1F9F5
Light backgroundsTable row hoverSkeleton loading
200
C7F5
#C7F5EC
Secondary backgroundsInput backgroundsDividers
300
9CED
#9CEDDD
BordersInactive statesPlaceholder text
400
68E3
#68E3CB
Disabled statesSecondary iconsMuted text
500
3DDB
#3DDBBC
Primary brand colorCTAsActive elementsLinks
600
23BE
#23BE9F
Hover statesFocus ringsPrimary buttons hover
700
1C97
#1C977E
Active/pressed statesDark mode accentsSecondary text
800
146C
#146C5A
Text on light backgroundsHeadingsStrong borders
900
0D45
#0D453A
Primary textHigh emphasis contentDark headings
950
082B
#082B24
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sea-green-50: #F2FDFB;
  --sea-green-100: #E1F9F5;
  --sea-green-200: #C7F5EC;
  --sea-green-300: #9CEDDD;
  --sea-green-400: #68E3CB;
  --sea-green-500: #3DDBBC;
  --sea-green-600: #23BE9F;
  --sea-green-700: #1C977E;
  --sea-green-800: #146C5A;
  --sea-green-900: #0D453A;
  --sea-green-950: #082B24;
}
Generate More ShadesCreate PaletteConvert Color