Silver

#8EABBE

Blue

Color Codes

All color formats for development

HEX
#8EABBE
RGB
rgb(142, 171, 190)
HSL
hsl(204, 27%, 65%)
OKLCH
oklch(0.726 0.042 236.9)
CMYK
cmyk(25%, 10%, 0%, 25%)

Accessibility

WCAG contrast compliance

On White Background

2.41:1

AA AAA

On Black Background

8.72:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F5F8
100
#E8EE
200
#D5E0
300
#B5C8
400
#8EAB
500
#6D92
600
#5276
700
#415E
800
#2F43
900
#1E2B
950
#131B

Shades

Darker variations

1#799BB2
2#648BA6
3#557A93
4#49697E
5#3C5769
6#304654
7#24343F
8#18232A
9#0C1115

Tints

Lighter variations

1#99B3C4
2#A4BBCB
3#B0C4D1
4#BBCCD8
5#C6D5DE
6#D2DDE5
7#DDE6EB
8#E8EEF2
9#F4F7F8

Tones

Muted variations

1#90AABB
2#92AAB9
3#95A9B7
4#97A9B4
5#9AA8B2
6#9CA8AF
7#9FA7AD
8#A1A7AB
9#A3A6A8

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F5F8
#F5F8F9
BackgroundsSubtle highlightsCard backgrounds
100
E8EE
#E8EEF2
Light backgroundsTable row hoverSkeleton loading
200
D5E0
#D5E0E7
Secondary backgroundsInput backgroundsDividers
300
B5C8
#B5C8D4
BordersInactive statesPlaceholder text
400
8EAB
#8EABBE
Disabled statesSecondary iconsMuted text
500
6D92
#6D92AB
Primary brand colorCTAsActive elementsLinks
600
5276
#52768E
Hover statesFocus ringsPrimary buttons hover
700
415E
#415E71
Active/pressed statesDark mode accentsSecondary text
800
2F43
#2F4351
Text on light backgroundsHeadingsStrong borders
900
1E2B
#1E2B34
Primary textHigh emphasis contentDark headings
950
131B
#131B20
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --silver-50: #F5F8F9;
  --silver-100: #E8EEF2;
  --silver-200: #D5E0E7;
  --silver-300: #B5C8D4;
  --silver-400: #8EABBE;
  --silver-500: #6D92AB;
  --silver-600: #52768E;
  --silver-700: #415E71;
  --silver-800: #2F4351;
  --silver-900: #1E2B34;
  --silver-950: #131B20;
}
Generate More ShadesCreate PaletteConvert Color