Sky Blue

#8A92FF

Blue

Color Codes

All color formats for development

HEX
#8A92FF
RGB
rgb(138, 146, 255)
HSL
hsl(236, 100%, 77%)
OKLCH
oklch(0.702 0.158 278.3)
CMYK
cmyk(46%, 43%, 0%, 0%)

Accessibility

WCAG contrast compliance

On White Background

2.75:1

AA AAA

On Black Background

7.64:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F0F1
100
#DBDE
200
#BDC1
300
#8A92
400
#4D58
500
#1A29
600
#000F
700
#000C
800
#0009
900
#0005
950
#0003

Shades

Darker variations

1#626DFF
2#3B48FF
3#1424FF
4#0010EC
5#000DC4
6#000A9D
7#000876
8#00054F
9#000327

Tints

Lighter variations

1#959CFF
2#A1A7FF
3#ADB2FF
4#B9BDFF
5#C4C8FF
6#D0D3FF
7#DCDEFF
8#E8E9FF
9#F3F4FF

Tones

Muted variations

1#9097F9
2#959CF3
3#9BA1ED
4#A1A6E8
5#A7ABE2
6#ADB0DC
7#B3B5D6
8#B9BAD0
9#BEBFCA

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F0F1
#F0F1FF
BackgroundsSubtle highlightsCard backgrounds
100
DBDE
#DBDEFF
Light backgroundsTable row hoverSkeleton loading
200
BDC1
#BDC1FF
Secondary backgroundsInput backgroundsDividers
300
8A92
#8A92FF
BordersInactive statesPlaceholder text
400
4D58
#4D58FF
Disabled statesSecondary iconsMuted text
500
1A29
#1A29FF
Primary brand colorCTAsActive elementsLinks
600
000F
#000FE0
Hover statesFocus ringsPrimary buttons hover
700
000C
#000CB3
Active/pressed statesDark mode accentsSecondary text
800
0009
#000980
Text on light backgroundsHeadingsStrong borders
900
0005
#000552
Primary textHigh emphasis contentDark headings
950
0003
#000333
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sky-blue-50: #F0F1FF;
  --sky-blue-100: #DBDEFF;
  --sky-blue-200: #BDC1FF;
  --sky-blue-300: #8A92FF;
  --sky-blue-400: #4D58FF;
  --sky-blue-500: #1A29FF;
  --sky-blue-600: #000FE0;
  --sky-blue-700: #000CB3;
  --sky-blue-800: #000980;
  --sky-blue-900: #000552;
  --sky-blue-950: #000333;
}
Generate More ShadesCreate PaletteConvert Color