Salmon

#EB6073

Red

Color Codes

All color formats for development

HEX
#EB6073
RGB
rgb(235, 96, 115)
HSL
hsl(352, 78%, 65%)
OKLCH
oklch(0.67 0.172 14.8)
CMYK
cmyk(0%, 59%, 51%, 8%)

Accessibility

WCAG contrast compliance

On White Background

3.25:1

AA AAA

On Black Background

6.45:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FDF1
100
#FBDF
200
#F8C4
300
#F297
400
#EB60
500
#E633
600
#C819
700
#9F14
800
#710E
900
#4909
950
#2D06

Shades

Darker variations

1#E84359
2#E4253F
3#CF1A32
4#B1162B
5#941223
6#760F1C
7#590B15
8#3B070E
9#1E0407

Tints

Lighter variations

1#ED7081
2#EF808F
3#F1909D
4#F3A0AB
5#F5B0B9
6#F7BFC7
7#F9CFD5
8#FBDFE3
9#FDEFF1

Tones

Muted variations

1#E46778
2#DD6E7D
3#D67582
4#D07C87
5#C9838C
6#C28A91
7#BB9196
8#B4989C
9#AD9FA1

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF1
#FDF1F3
BackgroundsSubtle highlightsCard backgrounds
100
FBDF
#FBDFE3
Light backgroundsTable row hoverSkeleton loading
200
F8C4
#F8C4CB
Secondary backgroundsInput backgroundsDividers
300
F297
#F297A3
BordersInactive statesPlaceholder text
400
EB60
#EB6073
Disabled statesSecondary iconsMuted text
500
E633
#E6334B
Primary brand colorCTAsActive elementsLinks
600
C819
#C81930
Hover statesFocus ringsPrimary buttons hover
700
9F14
#9F1426
Active/pressed statesDark mode accentsSecondary text
800
710E
#710E1B
Text on light backgroundsHeadingsStrong borders
900
4909
#490911
Primary textHigh emphasis contentDark headings
950
2D06
#2D060B
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --salmon-50: #FDF1F3;
  --salmon-100: #FBDFE3;
  --salmon-200: #F8C4CB;
  --salmon-300: #F297A3;
  --salmon-400: #EB6073;
  --salmon-500: #E6334B;
  --salmon-600: #C81930;
  --salmon-700: #9F1426;
  --salmon-800: #710E1B;
  --salmon-900: #490911;
  --salmon-950: #2D060B;
}
Generate More ShadesCreate PaletteConvert Color