Salmon

#EB7A60

Red

Color Codes

All color formats for development

HEX
#EB7A60
RGB
rgb(235, 122, 96)
HSL
hsl(11, 78%, 65%)
OKLCH
oklch(0.703 0.145 34.1)
CMYK
cmyk(0%, 48%, 59%, 8%)

Accessibility

WCAG contrast compliance

On White Background

2.81:1

AA AAA

On Black Background

7.49:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FDF4
100
#FBE4
200
#F8CD
300
#F2A7
400
#EB7A
500
#E654
600
#C839
700
#9F2D
800
#7120
900
#4915
950
#2D0D

Shades

Darker variations

1#E86143
2#E44825
3#CF3B1A
4#B13216
5#942A12
6#76220F
7#59190B
8#3B1107
9#1E0804

Tints

Lighter variations

1#ED8770
2#EF9480
3#F1A290
4#F3AFA0
5#F5BCB0
6#F7CABF
7#F9D7CF
8#FBE4DF
9#FDF2EF

Tones

Muted variations

1#E47E67
2#DD826E
3#D68775
4#D08B7C
5#C99083
6#C2948A
7#BB9991
8#B49D98
9#ADA19F

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF4
#FDF4F1
BackgroundsSubtle highlightsCard backgrounds
100
FBE4
#FBE4DF
Light backgroundsTable row hoverSkeleton loading
200
F8CD
#F8CDC4
Secondary backgroundsInput backgroundsDividers
300
F2A7
#F2A797
BordersInactive statesPlaceholder text
400
EB7A
#EB7A60
Disabled statesSecondary iconsMuted text
500
E654
#E65433
Primary brand colorCTAsActive elementsLinks
600
C839
#C83919
Hover statesFocus ringsPrimary buttons hover
700
9F2D
#9F2D14
Active/pressed statesDark mode accentsSecondary text
800
7120
#71200E
Text on light backgroundsHeadingsStrong borders
900
4915
#491509
Primary textHigh emphasis contentDark headings
950
2D0D
#2D0D06
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --salmon-50: #FDF4F1;
  --salmon-100: #FBE4DF;
  --salmon-200: #F8CDC4;
  --salmon-300: #F2A797;
  --salmon-400: #EB7A60;
  --salmon-500: #E65433;
  --salmon-600: #C83919;
  --salmon-700: #9F2D14;
  --salmon-800: #71200E;
  --salmon-900: #491509;
  --salmon-950: #2D0D06;
}
Generate More ShadesCreate PaletteConvert Color