Silver

#AFC8DA

Blue

Color Codes

All color formats for development

HEX

#AFC8DA

RGB

rgb(175, 200, 218)

HSL

hsl(205, 37%, 77%)

OKLCH

oklch(0.82 0.037 239.3)

CMYK

cmyk(20%, 8%, 0%, 15%)

Accessibility

WCAG contrast compliance

On White Background

1.74:1

AA ✗AAA ✗

On Black Background

12.10:1

AA ✓AAA ✓

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#F5F8

100

#E7EE

200

#D2E0

300

#AFC8

400

#85AB

500

#6293

600

#4777

700

#385F

800

#2844

900

#1A2B

950

#101B

Shades

Darker variations

1#94B6CE

2#79A3C1

3#5E91B5

4#4A7DA1

5#3E6886

6#31536C

7#253F51

8#192A36

9#0C151B

Tints

Lighter variations

1#B7CDDE

2#BFD3E1

3#C7D8E5

4#CFDEE9

5#D7E3ED

6#DFE9F0

7#E7EEF4

8#EFF4F8

9#F7F9FB

Tones

Muted variations

1#B1C8D8

2#B3C7D6

3#B5C7D4

4#B7C7D1

5#B9C6CF

6#BCC6CD

7#BEC5CB

8#C0C5C9

9#C2C5C7

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	F5F8 `#F5F8FA`	BackgroundsSubtle highlightsCard backgrounds
100	E7EE `#E7EEF4`	Light backgroundsTable row hoverSkeleton loading
200	D2E0 `#D2E0EA`	Secondary backgroundsInput backgroundsDividers
300	AFC8 `#AFC8DA`	BordersInactive statesPlaceholder text
400	85AB `#85ABC7`	Disabled statesSecondary iconsMuted text
500	6293 `#6293B7`	Primary brand colorCTAsActive elementsLinks
600	4777 `#47779A`	Hover statesFocus ringsPrimary buttons hover
700	385F `#385F7A`	Active/pressed statesDark mode accentsSecondary text
800	2844 `#284457`	Text on light backgroundsHeadingsStrong borders
900	1A2B `#1A2B38`	Primary textHigh emphasis contentDark headings
950	101B `#101B23`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --silver-50: #F5F8FA;
  --silver-100: #E7EEF4;
  --silver-200: #D2E0EA;
  --silver-300: #AFC8DA;
  --silver-400: #85ABC7;
  --silver-500: #6293B7;
  --silver-600: #47779A;
  --silver-700: #385F7A;
  --silver-800: #284457;
  --silver-900: #1A2B38;
  --silver-950: #101B23;
}

Generate More Shades Create Palette Convert Color