Salmon

#FC8D8D

Red

Color Codes

All color formats for development

HEX
#FC8D8D
RGB
rgb(252, 141, 141)
HSL
hsl(0, 95%, 77%)
OKLCH
oklch(0.763 0.135 20.7)
CMYK
cmyk(0%, 44%, 44%, 1%)

Accessibility

WCAG contrast compliance

On White Background

2.25:1

AA AAA

On Black Background

9.33:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FFF0
100
#FEDC
200
#FDBE
300
#FC8D
400
#FB51
500
#F91F
600
#DB06
700
#AE04
800
#7C03
900
#5002
950
#3201

Shades

Darker variations

1#FB6666
2#FA4040
3#F91A1A
4#E60606
5#BF0505
6#990404
7#730303
8#4D0202
9#260101

Tints

Lighter variations

1#FC9898
2#FDA4A4
3#FDAFAF
4#FDBABA
5#FEC6C6
6#FED1D1
7#FEDDDD
8#FEE8E8
9#FFF4F4

Tones

Muted variations

1#F69292
2#F19898
3#EB9D9D
4#E6A3A3
5#E0A8A8
6#DBAEAE
7#D5B4B4
8#CFB9B9
9#CABFBF

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FFF0
#FFF0F0
BackgroundsSubtle highlightsCard backgrounds
100
FEDC
#FEDCDC
Light backgroundsTable row hoverSkeleton loading
200
FDBE
#FDBEBE
Secondary backgroundsInput backgroundsDividers
300
FC8D
#FC8D8D
BordersInactive statesPlaceholder text
400
FB51
#FB5151
Disabled statesSecondary iconsMuted text
500
F91F
#F91F1F
Primary brand colorCTAsActive elementsLinks
600
DB06
#DB0606
Hover statesFocus ringsPrimary buttons hover
700
AE04
#AE0404
Active/pressed statesDark mode accentsSecondary text
800
7C03
#7C0303
Text on light backgroundsHeadingsStrong borders
900
5002
#500202
Primary textHigh emphasis contentDark headings
950
3201
#320101
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --salmon-50: #FFF0F0;
  --salmon-100: #FEDCDC;
  --salmon-200: #FDBEBE;
  --salmon-300: #FC8D8D;
  --salmon-400: #FB5151;
  --salmon-500: #F91F1F;
  --salmon-600: #DB0606;
  --salmon-700: #AE0404;
  --salmon-800: #7C0303;
  --salmon-900: #500202;
  --salmon-950: #320101;
}
Generate More ShadesCreate PaletteConvert Color