Indian Red

#E23670

Pink

Color Codes

All color formats for development

HEX
#E23670
RGB
rgb(226, 54, 112)
HSL
hsl(340, 75%, 55%)
OKLCH
oklch(0.612 0.209 6.1)
CMYK
cmyk(0%, 76%, 50%, 11%)

Accessibility

WCAG contrast compliance

On White Background

4.20:1

AA AAA

On Black Background

5.00:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FDF2
100
#FBE0
200
#F7C5
300
#F098
400
#E963
500
#E236
600
#C41C
700
#9C16
800
#7010
900
#470A
950
#2D06

Shades

Darker variations

1#DD205F
2#C41C54
3#AC194A
4#93153F
5#7B1235
6#620E2A
7#4A0B20
8#310715
9#19040B

Tints

Lighter variations

1#E54A7E
2#E85E8C
3#EB729B
4#EE87A9
5#F19BB7
6#F4AFC6
7#F6C3D4
8#F9D7E2
9#FCEBF1

Tones

Muted variations

1#DA3F72
2#D14775
3#C85078
4#C0597B
5#B7617E
6#AF6A81
7#A67284
8#9D7B87
9#958489

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF2
#FDF2F5
BackgroundsSubtle highlightsCard backgrounds
100
FBE0
#FBE0E9
Light backgroundsTable row hoverSkeleton loading
200
F7C5
#F7C5D6
Secondary backgroundsInput backgroundsDividers
300
F098
#F098B6
BordersInactive statesPlaceholder text
400
E963
#E9638F
Disabled statesSecondary iconsMuted text
500
E236
#E23670
Primary brand colorCTAsActive elementsLinks
600
C41C
#C41C54
Hover statesFocus ringsPrimary buttons hover
700
9C16
#9C1643
Active/pressed statesDark mode accentsSecondary text
800
7010
#701030
Text on light backgroundsHeadingsStrong borders
900
470A
#470A1F
Primary textHigh emphasis contentDark headings
950
2D06
#2D0613
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --indian-red-50: #FDF2F5;
  --indian-red-100: #FBE0E9;
  --indian-red-200: #F7C5D6;
  --indian-red-300: #F098B6;
  --indian-red-400: #E9638F;
  --indian-red-500: #E23670;
  --indian-red-600: #C41C54;
  --indian-red-700: #9C1643;
  --indian-red-800: #701030;
  --indian-red-900: #470A1F;
  --indian-red-950: #2D0613;
}
Generate More ShadesCreate PaletteConvert Color