Indian Red

#E33561

Red

Color Codes

All color formats for development

HEX
#E33561
RGB
rgb(227, 53, 97)
HSL
hsl(345, 76%, 55%)
OKLCH
oklch(0.609 0.209 11.9)
CMYK
cmyk(0%, 77%, 57%, 11%)

Accessibility

WCAG contrast compliance

On White Background

4.24:1

AA AAA

On Black Background

4.95: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#DE1E4E
2#C51B46
3#AD183D
4#941434
5#7B112B
6#630D23
7#4A0A1A
8#310711
9#190309

Tints

Lighter variations

1#E64970
2#E95D80
3#EC7290
4#EE86A0
5#F19AB0
6#F4AEC0
7#F7C2CF
8#F9D7DF
9#FCEBEF

Tones

Muted variations

1#DB3E65
2#D24669
3#C94F6E
4#C15872
5#B86176
6#AF697B
7#A6727F
8#9E7B84
9#958488

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF2
#FDF2F4
BackgroundsSubtle highlightsCard backgrounds
100
FBE0
#FBE0E6
Light backgroundsTable row hoverSkeleton loading
200
F7C5
#F7C5D1
Secondary backgroundsInput backgroundsDividers
300
F198
#F198AE
BordersInactive statesPlaceholder text
400
EA62
#EA6284
Disabled statesSecondary iconsMuted text
500
E335
#E33561
Primary brand colorCTAsActive elementsLinks
600
C51B
#C51B46
Hover statesFocus ringsPrimary buttons hover
700
9D15
#9D1537
Active/pressed statesDark mode accentsSecondary text
800
700F
#700F28
Text on light backgroundsHeadingsStrong borders
900
480A
#480A19
Primary textHigh emphasis contentDark headings
950
2D06
#2D0610
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --indian-red-50: #FDF2F4;
  --indian-red-100: #FBE0E6;
  --indian-red-200: #F7C5D1;
  --indian-red-300: #F198AE;
  --indian-red-400: #EA6284;
  --indian-red-500: #E33561;
  --indian-red-600: #C51B46;
  --indian-red-700: #9D1537;
  --indian-red-800: #700F28;
  --indian-red-900: #480A19;
  --indian-red-950: #2D0610;
}
Generate More ShadesCreate PaletteConvert Color