Silver

#A1E8C6

Green

Color Codes

All color formats for development

HEX
#A1E8C6
RGB
rgb(161, 232, 198)
HSL
hsl(151, 61%, 77%)
OKLCH
oklch(0.875 0.085 163.3)
CMYK
cmyk(31%, 0%, 15%, 9%)

Accessibility

WCAG contrast compliance

On White Background

1.41:1

AA AAA

On Black Background

14.87:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#F3FC
100
#E2F8
200
#CAF2
300
#A1E8
400
#6FDC
500
#46D2
600
#2CB5
700
#2390
800
#1967
900
#1042
950
#0A29

Shades

Darker variations

1#81E0B2
2#61D99F
3#42D18C
4#2EBE78
5#269E64
6#1F7E50
7#175F3C
8#0F3F28
9#082014

Tints

Lighter variations

1#AAEACB
2#B3EDD1
3#BDEFD7
4#C6F1DD
5#D0F4E2
6#D9F6E8
7#E3F8EE
8#ECFAF4
9#F6FDF9

Tones

Muted variations

1#A4E5C5
2#A8E1C5
3#ABDDC5
4#AFDAC5
5#B2D6C5
6#B6D3C5
7#BACFC5
8#BDCCC5
9#C1C8C4

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
F3FC
#F3FCF8
BackgroundsSubtle highlightsCard backgrounds
100
E2F8
#E2F8EE
Light backgroundsTable row hoverSkeleton loading
200
CAF2
#CAF2DF
Secondary backgroundsInput backgroundsDividers
300
A1E8
#A1E8C6
BordersInactive statesPlaceholder text
400
6FDC
#6FDCA8
Disabled statesSecondary iconsMuted text
500
46D2
#46D28F
Primary brand colorCTAsActive elementsLinks
600
2CB5
#2CB572
Hover statesFocus ringsPrimary buttons hover
700
2390
#23905B
Active/pressed statesDark mode accentsSecondary text
800
1967
#196741
Text on light backgroundsHeadingsStrong borders
900
1042
#10422A
Primary textHigh emphasis contentDark headings
950
0A29
#0A291A
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --silver-50: #F3FCF8;
  --silver-100: #E2F8EE;
  --silver-200: #CAF2DF;
  --silver-300: #A1E8C6;
  --silver-400: #6FDCA8;
  --silver-500: #46D28F;
  --silver-600: #2CB572;
  --silver-700: #23905B;
  --silver-800: #196741;
  --silver-900: #10422A;
  --silver-950: #0A291A;
}
Generate More ShadesCreate PaletteConvert Color