Deep Pink

#E92FAB

Pink

Color Codes

All color formats for development

HEX
#E92FAB
RGB
rgb(233, 47, 171)
HSL
hsl(320, 81%, 55%)
OKLCH
oklch(0.639 0.243 345.7)
CMYK
cmyk(0%, 80%, 27%, 9%)

Accessibility

WCAG contrast compliance

On White Background

3.85:1

AA AAA

On Black Background

5.46:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FEF1
100
#FCDF
200
#F9C3
300
#F495
400
#EE5D
500
#E92F
600
#CB15
700
#A211
800
#730C
900
#4A08
950
#2E05

Shades

Darker variations

1#E418A0
2#CB158E
3#B2137D
4#98106B
5#7F0D59
6#660B47
7#4C0835
8#330524
9#190312

Tints

Lighter variations

1#EB44B4
2#EE59BC
3#F06EC4
4#F282CD
5#F497D5
6#F6ACDD
7#F8C1E6
8#FBD5EE
9#FDEAF7

Tones

Muted variations

1#E039A8
2#D742A5
3#CD4BA2
4#C4549F
5#BB5E9C
6#B16799
7#A87096
8#9F7A92
9#96838F

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FEF1
#FEF1F9
BackgroundsSubtle highlightsCard backgrounds
100
FCDF
#FCDFF2
Light backgroundsTable row hoverSkeleton loading
200
F9C3
#F9C3E7
Secondary backgroundsInput backgroundsDividers
300
F495
#F495D4
BordersInactive statesPlaceholder text
400
EE5D
#EE5DBE
Disabled statesSecondary iconsMuted text
500
E92F
#E92FAB
Primary brand colorCTAsActive elementsLinks
600
CB15
#CB158E
Hover statesFocus ringsPrimary buttons hover
700
A211
#A21171
Active/pressed statesDark mode accentsSecondary text
800
730C
#730C51
Text on light backgroundsHeadingsStrong borders
900
4A08
#4A0834
Primary textHigh emphasis contentDark headings
950
2E05
#2E0520
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --deep-pink-50: #FEF1F9;
  --deep-pink-100: #FCDFF2;
  --deep-pink-200: #F9C3E7;
  --deep-pink-300: #F495D4;
  --deep-pink-400: #EE5DBE;
  --deep-pink-500: #E92FAB;
  --deep-pink-600: #CB158E;
  --deep-pink-700: #A21171;
  --deep-pink-800: #730C51;
  --deep-pink-900: #4A0834;
  --deep-pink-950: #2E0520;
}
Generate More ShadesCreate PaletteConvert Color