Black

#090132

Blue

Color Codes

All color formats for development

HEX
#090132
RGB
rgb(9, 1, 50)
HSL
hsl(250, 96%, 10%)
OKLCH
oklch(0.157 0.092 278.8)
CMYK
cmyk(82%, 98%, 0%, 80%)

Accessibility

WCAG contrast compliance

On White Background

19.77:1

AA AAA

On Black Background

1.06:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2F0
100
#E2DC
200
#C9BE
300
#9F8C
400
#6D50
500
#431E
600
#2804
700
#2004
800
#1703
900
#0F02
950
#0901

Shades

Darker variations

1#08012D
2#070128
3#060123
4#06011E
5#050119
6#040014
7#03000F
8#02000A
9#010005

Tints

Lighter variations

1#11025F
2#1A038C
3#2204B9
4#2A05E6
5#431EFA
6#684BFB
7#8E78FC
8#B4A5FD
9#D9D2FE

Tones

Muted variations

1#0B0330
2#0C062D
3#0E082B
4#100B28
5#110D26
6#131023
7#151221
8#16151E
9#18171C

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2F0
#F2F0FF
BackgroundsSubtle highlightsCard backgrounds
100
E2DC
#E2DCFE
Light backgroundsTable row hoverSkeleton loading
200
C9BE
#C9BEFE
Secondary backgroundsInput backgroundsDividers
300
9F8C
#9F8CFD
BordersInactive statesPlaceholder text
400
6D50
#6D50FB
Disabled statesSecondary iconsMuted text
500
431E
#431EFA
Primary brand colorCTAsActive elementsLinks
600
2804
#2804DC
Hover statesFocus ringsPrimary buttons hover
700
2004
#2004AF
Active/pressed statesDark mode accentsSecondary text
800
1703
#17037D
Text on light backgroundsHeadingsStrong borders
900
0F02
#0F0250
Primary textHigh emphasis contentDark headings
950
0901
#090132
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --black-50: #F2F0FF;
  --black-100: #E2DCFE;
  --black-200: #C9BEFE;
  --black-300: #9F8CFD;
  --black-400: #6D50FB;
  --black-500: #431EFA;
  --black-600: #2804DC;
  --black-700: #2004AF;
  --black-800: #17037D;
  --black-900: #0F0250;
  --black-950: #090132;
}
Generate More ShadesCreate PaletteConvert Color