Silver

#99AEB2

Cyan

Color Codes

All color formats for development

HEX
#99AEB2
RGB
rgb(153, 174, 178)
HSL
hsl(190, 14%, 65%)
OKLCH
oklch(0.736 0.024 210.4)
CMYK
cmyk(14%, 2%, 0%, 30%)

Accessibility

WCAG contrast compliance

On White Background

2.32:1

AA AAA

On Black Background

9.05:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F6F8
100
#EBEF
200
#D9E1
300
#BCCA
400
#99AE
500
#7C97
600
#607B
700
#4D62
800
#3746
900
#232D
950
#161C

Shades

Darker variations

1#869FA4
2#739096
3#647F84
4#566D71
5#475B5E
6#39484C
7#2B3639
8#1D2426
9#0E1213

Tints

Lighter variations

1#A3B6BA
2#AEBEC2
3#B8C6C9
4#C2CED1
5#CCD7D9
6#D6DFE0
7#E0E7E8
8#EBEFF0
9#F5F7F7

Tones

Muted variations

1#9BADB1
2#9CACB0
3#9DACAE
4#9EABAD
5#A0AAAC
6#A1A9AB
7#A2A8A9
8#A3A7A8
9#A5A7A7

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F6F8
#F6F8F8
BackgroundsSubtle highlightsCard backgrounds
100
EBEF
#EBEFF0
Light backgroundsTable row hoverSkeleton loading
200
D9E1
#D9E1E2
Secondary backgroundsInput backgroundsDividers
300
BCCA
#BCCACD
BordersInactive statesPlaceholder text
400
99AE
#99AEB2
Disabled statesSecondary iconsMuted text
500
7C97
#7C979C
Primary brand colorCTAsActive elementsLinks
600
607B
#607B80
Hover statesFocus ringsPrimary buttons hover
700
4D62
#4D6266
Active/pressed statesDark mode accentsSecondary text
800
3746
#374649
Text on light backgroundsHeadingsStrong borders
900
232D
#232D2F
Primary textHigh emphasis contentDark headings
950
161C
#161C1D
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --silver-50: #F6F8F8;
  --silver-100: #EBEFF0;
  --silver-200: #D9E1E2;
  --silver-300: #BCCACD;
  --silver-400: #99AEB2;
  --silver-500: #7C979C;
  --silver-600: #607B80;
  --silver-700: #4D6266;
  --silver-800: #374649;
  --silver-900: #232D2F;
  --silver-950: #161C1D;
}
Generate More ShadesCreate PaletteConvert Color