Silver

#8FB2BD

Cyan

Color Codes

All color formats for development

HEX
#8FB2BD
RGB
rgb(143, 178, 189)
HSL
hsl(194, 26%, 65%)
OKLCH
oklch(0.741 0.041 218.9)
CMYK
cmyk(24%, 6%, 0%, 26%)

Accessibility

WCAG contrast compliance

On White Background

2.27:1

AA AAA

On Black Background

9.27:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F5F8
100
#E9F0
200
#D5E2
300
#B5CC
400
#8FB2
500
#6E9C
600
#5380
700
#4266
800
#2F49
900
#1E2E
950
#131D

Shades

Darker variations

1#7AA4B1
2#6596A4
3#568492
4#4A717D
5#3D5E68
6#314B54
7#25393F
8#19262A
9#0C1315

Tints

Lighter variations

1#9ABAC4
2#A5C2CA
3#B0C9D1
4#BCD1D7
5#C7D9DE
6#D2E0E5
7#DDE8EB
8#E9F0F2
9#F4F7F8

Tones

Muted variations

1#91B1BB
2#93B0B8
3#96AEB6
4#98ADB4
5#9AACB1
6#9CABAF
7#9FA9AD
8#A1A8AA
9#A3A7A8

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F5F8
#F5F8F9
BackgroundsSubtle highlightsCard backgrounds
100
E9F0
#E9F0F2
Light backgroundsTable row hoverSkeleton loading
200
D5E2
#D5E2E6
Secondary backgroundsInput backgroundsDividers
300
B5CC
#B5CCD4
BordersInactive statesPlaceholder text
400
8FB2
#8FB2BD
Disabled statesSecondary iconsMuted text
500
6E9C
#6E9CAA
Primary brand colorCTAsActive elementsLinks
600
5380
#53808D
Hover statesFocus ringsPrimary buttons hover
700
4266
#426670
Active/pressed statesDark mode accentsSecondary text
800
2F49
#2F4950
Text on light backgroundsHeadingsStrong borders
900
1E2E
#1E2E33
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: #E9F0F2;
  --silver-200: #D5E2E6;
  --silver-300: #B5CCD4;
  --silver-400: #8FB2BD;
  --silver-500: #6E9CAA;
  --silver-600: #53808D;
  --silver-700: #426670;
  --silver-800: #2F4950;
  --silver-900: #1E2E33;
  --silver-950: #131D20;
}
Generate More ShadesCreate PaletteConvert Color