Dodger Blue

#1EC7FA

Cyan

Color Codes

All color formats for development

HEX
#1EC7FA
RGB
rgb(30, 199, 250)
HSL
hsl(194, 96%, 55%)
OKLCH
oklch(0.774 0.143 225.6)
CMYK
cmyk(88%, 20%, 0%, 2%)

Accessibility

WCAG contrast compliance

On White Background

1.98:1

AA AAA

On Black Background

10.60:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F0FB
100
#DCF6
200
#BEEF
300
#8CE2
400
#50D3
500
#1EC7
600
#04AA
700
#0487
800
#0360
900
#023E
950
#0127

Shades

Darker variations

1#05BFF7
2#04AADC
3#0494C0
4#037FA5
5#036A89
6#02556E
7#024052
8#012A37
9#01151B

Tints

Lighter variations

1#35CDFB
2#4BD2FB
3#62D8FC
4#78DDFC
5#8FE3FD
6#A5E9FD
7#BCEEFE
8#D2F4FE
9#E9F9FF

Tones

Muted variations

1#29C1EF
2#34BBE4
3#3FB5D9
4#4AB0CE
5#55AAC3
6#60A4B8
7#6B9EAD
8#7698A2
9#819297

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F0FB
#F0FBFF
BackgroundsSubtle highlightsCard backgrounds
100
DCF6
#DCF6FE
Light backgroundsTable row hoverSkeleton loading
200
BEEF
#BEEFFE
Secondary backgroundsInput backgroundsDividers
300
8CE2
#8CE2FD
BordersInactive statesPlaceholder text
400
50D3
#50D3FB
Disabled statesSecondary iconsMuted text
500
1EC7
#1EC7FA
Primary brand colorCTAsActive elementsLinks
600
04AA
#04AADC
Hover statesFocus ringsPrimary buttons hover
700
0487
#0487AF
Active/pressed statesDark mode accentsSecondary text
800
0360
#03607D
Text on light backgroundsHeadingsStrong borders
900
023E
#023E50
Primary textHigh emphasis contentDark headings
950
0127
#012732
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --dodger-blue-50: #F0FBFF;
  --dodger-blue-100: #DCF6FE;
  --dodger-blue-200: #BEEFFE;
  --dodger-blue-300: #8CE2FD;
  --dodger-blue-400: #50D3FB;
  --dodger-blue-500: #1EC7FA;
  --dodger-blue-600: #04AADC;
  --dodger-blue-700: #0487AF;
  --dodger-blue-800: #03607D;
  --dodger-blue-900: #023E50;
  --dodger-blue-950: #012732;
}
Generate More ShadesCreate PaletteConvert Color