Navy

#1A0DA5

Blue

Color Codes

All color formats for development

HEX
#1A0DA5
RGB
rgb(26, 13, 165)
HSL
hsl(245, 85%, 35%)
OKLCH
oklch(0.343 0.215 269.5)
CMYK
cmyk(84%, 92%, 0%, 35%)

Accessibility

WCAG contrast compliance

On White Background

12.77:1

AA AAA

On Black Background

1.64:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F2F1
100
#E1DE
200
#C6C2
300
#9B92
400
#675A
500
#3B2B
600
#2111
700
#1A0D
800
#130A
900
#0C06
950
#0704

Shades

Darker variations

1#170C95
2#150B84
3#120974
4#100863
5#0D0753
6#0A0542
7#080432
8#050321
9#030111

Tints

Lighter variations

1#1F10C4
2#2412E2
3#3928EE
4#5547F0
5#7166F3
6#8E84F5
7#AAA3F8
8#C6C2FA
9#E3E0FD

Tones

Muted variations

1#20159E
2#271D96
3#2D248E
4#332C87
5#3A337F
6#403B78
7#464270
8#4D4A68
9#535261

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F2F1
#F2F1FE
BackgroundsSubtle highlightsCard backgrounds
100
E1DE
#E1DEFC
Light backgroundsTable row hoverSkeleton loading
200
C6C2
#C6C2FA
Secondary backgroundsInput backgroundsDividers
300
9B92
#9B92F6
BordersInactive statesPlaceholder text
400
675A
#675AF2
Disabled statesSecondary iconsMuted text
500
3B2B
#3B2BEE
Primary brand colorCTAsActive elementsLinks
600
2111
#2111D0
Hover statesFocus ringsPrimary buttons hover
700
1A0D
#1A0DA5
Active/pressed statesDark mode accentsSecondary text
800
130A
#130A76
Text on light backgroundsHeadingsStrong borders
900
0C06
#0C064B
Primary textHigh emphasis contentDark headings
950
0704
#07042F
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --navy-50: #F2F1FE;
  --navy-100: #E1DEFC;
  --navy-200: #C6C2FA;
  --navy-300: #9B92F6;
  --navy-400: #675AF2;
  --navy-500: #3B2BEE;
  --navy-600: #2111D0;
  --navy-700: #1A0DA5;
  --navy-800: #130A76;
  --navy-900: #0C064B;
  --navy-950: #07042F;
}
Generate More ShadesCreate PaletteConvert Color