Indian Red

#E33566

Pink

Color Codes

All color formats for development

HEX
#E33566
RGB
rgb(227, 53, 102)
HSL
hsl(343, 76%, 55%)
OKLCH
oklch(0.61 0.209 10)
CMYK
cmyk(0%, 77%, 55%, 11%)

Accessibility

WCAG contrast compliance

On White Background

4.23:1

AA AAA

On Black Background

4.97:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FDF2
100
#FBE0
200
#F7C5
300
#F198
400
#EA62
500
#E335
600
#C51B
700
#9D15
800
#700F
900
#480A
950
#2D06

Shades

Darker variations

1#DE1E55
2#C51B4B
3#AD1842
4#941438
5#7B112F
6#630D26
7#4A0A1C
8#310713
9#190309

Tints

Lighter variations

1#E64976
2#E95D85
3#EC7294
4#EE86A3
5#F19AB3
6#F4AEC2
7#F7C2D1
8#F9D7E0
9#FCEBF0

Tones

Muted variations

1#DB3E6A
2#D2466E
3#C94F72
4#C15876
5#B86179
6#AF697D
7#A67281
8#9E7B85
9#958488

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF2
#FDF2F5
BackgroundsSubtle highlightsCard backgrounds
100
FBE0
#FBE0E7
Light backgroundsTable row hoverSkeleton loading
200
F7C5
#F7C5D3
Secondary backgroundsInput backgroundsDividers
300
F198
#F198B1
BordersInactive statesPlaceholder text
400
EA62
#EA6288
Disabled statesSecondary iconsMuted text
500
E335
#E33566
Primary brand colorCTAsActive elementsLinks
600
C51B
#C51B4B
Hover statesFocus ringsPrimary buttons hover
700
9D15
#9D153C
Active/pressed statesDark mode accentsSecondary text
800
700F
#700F2B
Text on light backgroundsHeadingsStrong borders
900
480A
#480A1B
Primary textHigh emphasis contentDark headings
950
2D06
#2D0611
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --indian-red-50: #FDF2F5;
  --indian-red-100: #FBE0E7;
  --indian-red-200: #F7C5D3;
  --indian-red-300: #F198B1;
  --indian-red-400: #EA6288;
  --indian-red-500: #E33566;
  --indian-red-600: #C51B4B;
  --indian-red-700: #9D153C;
  --indian-red-800: #700F2B;
  --indian-red-900: #480A1B;
  --indian-red-950: #2D0611;
}
Generate More ShadesCreate PaletteConvert Color