Sea Green

#35727E

Cyan

Color Codes

All color formats for development

HEX
#35727E
RGB
rgb(53, 114, 126)
HSL
hsl(190, 41%, 35%)
OKLCH
oklch(0.517 0.065 212.2)
CMYK
cmyk(58%, 10%, 0%, 51%)

Accessibility

WCAG contrast compliance

On White Background

5.44:1

AA AAA

On Black Background

3.86:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F4F9
100
#E6F2
200
#D0E7
300
#ACD4
400
#81BE
500
#5DAC
600
#428F
700
#3572
800
#2651
900
#1834
950
#0F20

Shades

Darker variations

1#2F6671
2#2A5B65
3#255058
4#20444C
5#1A393F
6#152D32
7#102226
8#0B1719
9#050B0D

Tints

Lighter variations

1#3E8795
2#489CAD
3#5BABBB
4#73B7C4
5#8AC3CE
6#A2CFD8
7#B9DBE2
8#D0E7EB
9#E8F3F5

Tones

Muted variations

1#386F7A
2#3C6D77
3#406A73
4#43686F
5#47656C
6#4B6368
7#4E6164
8#525E61
9#565C5D

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F4F9
#F4F9FA
BackgroundsSubtle highlightsCard backgrounds
100
E6F2
#E6F2F4
Light backgroundsTable row hoverSkeleton loading
200
D0E7
#D0E7EB
Secondary backgroundsInput backgroundsDividers
300
ACD4
#ACD4DC
BordersInactive statesPlaceholder text
400
81BE
#81BECA
Disabled statesSecondary iconsMuted text
500
5DAC
#5DACBB
Primary brand colorCTAsActive elementsLinks
600
428F
#428F9E
Hover statesFocus ringsPrimary buttons hover
700
3572
#35727E
Active/pressed statesDark mode accentsSecondary text
800
2651
#26515A
Text on light backgroundsHeadingsStrong borders
900
1834
#18343A
Primary textHigh emphasis contentDark headings
950
0F20
#0F2024
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sea-green-50: #F4F9FA;
  --sea-green-100: #E6F2F4;
  --sea-green-200: #D0E7EB;
  --sea-green-300: #ACD4DC;
  --sea-green-400: #81BECA;
  --sea-green-500: #5DACBB;
  --sea-green-600: #428F9E;
  --sea-green-700: #35727E;
  --sea-green-800: #26515A;
  --sea-green-900: #18343A;
  --sea-green-950: #0F2024;
}
Generate More ShadesCreate PaletteConvert Color