Silver

#AFCBD9

Blue

Color Codes

All color formats for development

HEX

#AFCBD9

RGB

rgb(175, 203, 217)

HSL

hsl(200, 36%, 77%)

OKLCH

oklch(0.826 0.036 229.4)

CMYK

cmyk(19%, 6%, 0%, 15%)

Accessibility

WCAG contrast compliance

On White Background

1.70:1

AA ✗AAA ✗

On Black Background

12.37:1

AA ✓AAA ✓

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#F5F8

100

#E7EF

200

#D2E2

300

#AFCB

400

#86B0

500

#639A

600

#487E

700

#3964

800

#2947

900

#1A2E

950

#101D

Shades

Darker variations

1#95BACD

2#7AA9C0

3#5F98B4

4#4B84A0

5#3F6E86

6#32586B

7#264250

8#192C35

9#0D161B

Tints

Lighter variations

1#B7D1DD

2#BFD6E1

3#C7DBE5

4#CFE0E8

5#D7E5EC

6#DFEAF0

7#E7F0F4

8#EFF5F7

9#F7FAFB

Tones

Muted variations

1#B1CBD7

2#B3CAD5

3#B6C9D3

4#B8C9D1

5#BAC8CF

6#BCC7CD

7#BEC6CB

8#C0C6C9

9#C2C5C6

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	F5F8 `#F5F8FA`	BackgroundsSubtle highlightsCard backgrounds
100	E7EF `#E7EFF4`	Light backgroundsTable row hoverSkeleton loading
200	D2E2 `#D2E2EA`	Secondary backgroundsInput backgroundsDividers
300	AFCB `#AFCBD9`	BordersInactive statesPlaceholder text
400	86B0 `#86B0C6`	Disabled statesSecondary iconsMuted text
500	639A `#639AB6`	Primary brand colorCTAsActive elementsLinks
600	487E `#487E99`	Hover statesFocus ringsPrimary buttons hover
700	3964 `#396479`	Active/pressed statesDark mode accentsSecondary text
800	2947 `#294757`	Text on light backgroundsHeadingsStrong borders
900	1A2E `#1A2E37`	Primary textHigh emphasis contentDark headings
950	101D `#101D23`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --silver-50: #F5F8FA;
  --silver-100: #E7EFF4;
  --silver-200: #D2E2EA;
  --silver-300: #AFCBD9;
  --silver-400: #86B0C6;
  --silver-500: #639AB6;
  --silver-600: #487E99;
  --silver-700: #396479;
  --silver-800: #294757;
  --silver-900: #1A2E37;
  --silver-950: #101D23;
}

Generate More Shades Create Palette Convert Color