Sky Blue

#8AFFE0

Green

Color Codes

All color formats for development

HEX
#8AFFE0
RGB
rgb(138, 255, 224)
HSL
hsl(164, 100%, 77%)
OKLCH
oklch(0.922 0.116 174.4)
CMYK
cmyk(46%, 0%, 12%, 0%)

Accessibility

WCAG contrast compliance

On White Background

1.20:1

AA AAA

On Black Background

17.46:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F0FF
100
#DBFF
200
#BDFF
300
#8AFF
400
#4DFF
500
#1AFF
600
#00E0
700
#00B3
800
#0080
900
#0052
950
#0033

Shades

Darker variations

1#62FFD5
2#3BFFCB
3#14FFC0
4#00ECAD
5#00C490
6#009D73
7#007656
8#004F3A
9#00271D

Tints

Lighter variations

1#95FFE3
2#A1FFE6
3#ADFFE9
4#B9FFEC
5#C4FFEF
6#D0FFF2
7#DCFFF6
8#E8FFF9
9#F3FFFC

Tones

Muted variations

1#90F9DD
2#95F3DA
3#9BEDD8
4#A1E8D5
5#A7E2D2
6#ADDCCF
7#B3D6CD
8#B9D0CA
9#BECAC7

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F0FF
#F0FFFB
BackgroundsSubtle highlightsCard backgrounds
100
DBFF
#DBFFF5
Light backgroundsTable row hoverSkeleton loading
200
BDFF
#BDFFED
Secondary backgroundsInput backgroundsDividers
300
8AFF
#8AFFE0
BordersInactive statesPlaceholder text
400
4DFF
#4DFFCF
Disabled statesSecondary iconsMuted text
500
1AFF
#1AFFC2
Primary brand colorCTAsActive elementsLinks
600
00E0
#00E0A5
Hover statesFocus ringsPrimary buttons hover
700
00B3
#00B383
Active/pressed statesDark mode accentsSecondary text
800
0080
#00805E
Text on light backgroundsHeadingsStrong borders
900
0052
#00523C
Primary textHigh emphasis contentDark headings
950
0033
#003325
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sky-blue-50: #F0FFFB;
  --sky-blue-100: #DBFFF5;
  --sky-blue-200: #BDFFED;
  --sky-blue-300: #8AFFE0;
  --sky-blue-400: #4DFFCF;
  --sky-blue-500: #1AFFC2;
  --sky-blue-600: #00E0A5;
  --sky-blue-700: #00B383;
  --sky-blue-800: #00805E;
  --sky-blue-900: #00523C;
  --sky-blue-950: #003325;
}
Generate More ShadesCreate PaletteConvert Color