Salmon

#FDA48B

Red

Color Codes

All color formats for development

HEX
#FDA48B
RGB
rgb(253, 164, 139)
HSL
hsl(13, 97%, 77%)
OKLCH
oklch(0.801 0.112 36.4)
CMYK
cmyk(0%, 35%, 45%, 1%)

Accessibility

WCAG contrast compliance

On White Background

1.93:1

AA AAA

On Black Background

10.86:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FFF3
100
#FEE3
200
#FECC
300
#FDA4
400
#FC75
500
#FC4D
600
#DD33
700
#B028
800
#7E1D
900
#5012
950
#320B

Shades

Darker variations

1#FD8665
2#FC673E
3#FB4917
4#E83504
5#C12C03
6#9B2302
7#741B02
8#4D1201
9#270901

Tints

Lighter variations

1#FDAD97
2#FEB6A3
3#FEBFAE
4#FEC8BA
5#FED2C5
6#FEDBD1
7#FEE4DC
8#FFEDE8
9#FFF6F3

Tones

Muted variations

1#F8A791
2#F2AB97
3#ECAE9D
4#E6B1A2
5#E1B4A8
6#DBB7AE
7#D5BBB3
8#D0BEB9
9#CAC1BF

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FFF3
#FFF3F0
BackgroundsSubtle highlightsCard backgrounds
100
FEE3
#FEE3DC
Light backgroundsTable row hoverSkeleton loading
200
FECC
#FECCBE
Secondary backgroundsInput backgroundsDividers
300
FDA4
#FDA48B
BordersInactive statesPlaceholder text
400
FC75
#FC754F
Disabled statesSecondary iconsMuted text
500
FC4D
#FC4D1D
Primary brand colorCTAsActive elementsLinks
600
DD33
#DD3303
Hover statesFocus ringsPrimary buttons hover
700
B028
#B02803
Active/pressed statesDark mode accentsSecondary text
800
7E1D
#7E1D02
Text on light backgroundsHeadingsStrong borders
900
5012
#501201
Primary textHigh emphasis contentDark headings
950
320B
#320B01
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --salmon-50: #FFF3F0;
  --salmon-100: #FEE3DC;
  --salmon-200: #FECCBE;
  --salmon-300: #FDA48B;
  --salmon-400: #FC754F;
  --salmon-500: #FC4D1D;
  --salmon-600: #DD3303;
  --salmon-700: #B02803;
  --salmon-800: #7E1D02;
  --salmon-900: #501201;
  --salmon-950: #320B01;
}
Generate More ShadesCreate PaletteConvert Color