Dodger Blue

#1280CE

Blue

Color Codes

All color formats for development

HEX
#1280CE
RGB
rgb(18, 128, 206)
HSL
hsl(205, 84%, 44%)
OKLCH
oklch(0.584 0.149 247.3)
CMYK
cmyk(91%, 38%, 0%, 19%)

Accessibility

WCAG contrast compliance

On White Background

4.20:1

AA AAA

On Black Background

5.00:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F1F8
100
#DEF0
200
#C2E2
300
#93CD
400
#5BB2
500
#2C9C
600
#1280
700
#0E66
800
#0A49
900
#072F
950
#041D

Shades

Darker variations

1#1073BA
2#0E66A5
3#0D5A91
4#0B4D7C
5#094067
6#073353
7#05263E
8#041A29
9#020D15

Tints

Lighter variations

1#1490E9
2#2D9DED
3#47A9EF
4#61B5F1
5#7CC2F4
6#96CEF6
7#B0DAF8
8#CAE6FA
9#E5F3FD

Tones

Muted variations

1#1B7EC5
2#257DBC
3#2E7BB2
4#387AA9
5#41789F
6#4B7696
7#54758C
8#5D7383
9#67727A

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F1F8
#F1F8FE
BackgroundsSubtle highlightsCard backgrounds
100
DEF0
#DEF0FC
Light backgroundsTable row hoverSkeleton loading
200
C2E2
#C2E2FA
Secondary backgroundsInput backgroundsDividers
300
93CD
#93CDF6
BordersInactive statesPlaceholder text
400
5BB2
#5BB2F1
Disabled statesSecondary iconsMuted text
500
2C9C
#2C9CED
Primary brand colorCTAsActive elementsLinks
600
1280
#1280CE
Hover statesFocus ringsPrimary buttons hover
700
0E66
#0E66A4
Active/pressed statesDark mode accentsSecondary text
800
0A49
#0A4975
Text on light backgroundsHeadingsStrong borders
900
072F
#072F4B
Primary textHigh emphasis contentDark headings
950
041D
#041D2F
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --dodger-blue-50: #F1F8FE;
  --dodger-blue-100: #DEF0FC;
  --dodger-blue-200: #C2E2FA;
  --dodger-blue-300: #93CDF6;
  --dodger-blue-400: #5BB2F1;
  --dodger-blue-500: #2C9CED;
  --dodger-blue-600: #1280CE;
  --dodger-blue-700: #0E66A4;
  --dodger-blue-800: #0A4975;
  --dodger-blue-900: #072F4B;
  --dodger-blue-950: #041D2F;
}
Generate More ShadesCreate PaletteConvert Color