Silver

#8EB3BE

Cyan

Color Codes

All color formats for development

HEX
#8EB3BE
RGB
rgb(142, 179, 190)
HSL
hsl(194, 27%, 65%)
OKLCH
oklch(0.743 0.043 217.8)
CMYK
cmyk(25%, 6%, 0%, 25%)

Accessibility

WCAG contrast compliance

On White Background

2.25:1

AA AAA

On Black Background

9.34:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F5F8
100
#E8F0
200
#D5E3
300
#B5CD
400
#8EB3
500
#6D9D
600
#5280
700
#4166
800
#2F49
900
#1E2F
950
#131D

Shades

Darker variations

1#79A4B2
2#6496A6
3#558593
4#49727E
5#3C5F69
6#304C54
7#24393F
8#18262A
9#0C1315

Tints

Lighter variations

1#99BAC4
2#A4C2CB
3#B0CAD1
4#BBD1D8
5#C6D9DE
6#D2E0E5
7#DDE8EB
8#E8F0F2
9#F4F7F8

Tones

Muted variations

1#90B1BB
2#92B0B9
3#95AFB7
4#97ADB4
5#9AACB2
6#9CABAF
7#9FAAAD
8#A1A8AB
9#A3A7A8

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F5F8
#F5F8F9
BackgroundsSubtle highlightsCard backgrounds
100
E8F0
#E8F0F2
Light backgroundsTable row hoverSkeleton loading
200
D5E3
#D5E3E7
Secondary backgroundsInput backgroundsDividers
300
B5CD
#B5CDD4
BordersInactive statesPlaceholder text
400
8EB3
#8EB3BE
Disabled statesSecondary iconsMuted text
500
6D9D
#6D9DAB
Primary brand colorCTAsActive elementsLinks
600
5280
#52808E
Hover statesFocus ringsPrimary buttons hover
700
4166
#416671
Active/pressed statesDark mode accentsSecondary text
800
2F49
#2F4951
Text on light backgroundsHeadingsStrong borders
900
1E2F
#1E2F34
Primary textHigh emphasis contentDark headings
950
131D
#131D20
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --silver-50: #F5F8F9;
  --silver-100: #E8F0F2;
  --silver-200: #D5E3E7;
  --silver-300: #B5CDD4;
  --silver-400: #8EB3BE;
  --silver-500: #6D9DAB;
  --silver-600: #52808E;
  --silver-700: #416671;
  --silver-800: #2F4951;
  --silver-900: #1E2F34;
  --silver-950: #131D20;
}
Generate More ShadesCreate PaletteConvert Color