Silver

#AFB3D9

Blue

Color Codes

All color formats for development

HEX

#AFB3D9

RGB

rgb(175, 179, 217)

HSL

hsl(234, 36%, 77%)

OKLCH

oklch(0.776 0.054 280.3)

CMYK

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

Accessibility

WCAG contrast compliance

On White Background

2.04:1

AA ✗AAA ✗

On Black Background

10.27:1

AA ✓AAA ✓

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#F5F5

100

#E7E8

200

#D2D4

300

#AFB3

400

#868C

500

#636B

600

#4850

700

#3940

800

#292D

900

#1A1D

950

#1012

Shades

Darker variations

1#959ACD

2#7A81C0

3#5F68B4

4#4B54A0

5#3F4686

6#32386B

7#262A50

8#191C35

9#0D0E1B

Tints

Lighter variations

1#B7BBDD

2#BFC3E1

3#C7CAE5

4#CFD2E8

5#D7D9EC

6#DFE1F0

7#E7E8F4

8#EFF0F7

9#F7F7FB

Tones

Muted variations

1#B1B5D7

2#B3B7D5

3#B6B9D3

4#B8BAD1

5#BABCCF

6#BCBECD

7#BEBFCB

8#C0C1C9

9#C2C3C6

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	F5F5 `#F5F5FA`	BackgroundsSubtle highlightsCard backgrounds
100	E7E8 `#E7E8F4`	Light backgroundsTable row hoverSkeleton loading
200	D2D4 `#D2D4EA`	Secondary backgroundsInput backgroundsDividers
300	AFB3 `#AFB3D9`	BordersInactive statesPlaceholder text
400	868C `#868CC6`	Disabled statesSecondary iconsMuted text
500	636B `#636BB6`	Primary brand colorCTAsActive elementsLinks
600	4850 `#485099`	Hover statesFocus ringsPrimary buttons hover
700	3940 `#394079`	Active/pressed statesDark mode accentsSecondary text
800	292D `#292D57`	Text on light backgroundsHeadingsStrong borders
900	1A1D `#1A1D37`	Primary textHigh emphasis contentDark headings
950	1012 `#101223`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --silver-50: #F5F5FA;
  --silver-100: #E7E8F4;
  --silver-200: #D2D4EA;
  --silver-300: #AFB3D9;
  --silver-400: #868CC6;
  --silver-500: #636BB6;
  --silver-600: #485099;
  --silver-700: #394079;
  --silver-800: #292D57;
  --silver-900: #1A1D37;
  --silver-950: #101223;
}

Generate More Shades Create Palette Convert Color