Indian Red

#E03857

Red

Color Codes

All color formats for development

HEX
#E03857
RGB
rgb(224, 56, 87)
HSL
hsl(349, 73%, 55%)
OKLCH
oklch(0.604 0.203 15.8)
CMYK
cmyk(0%, 75%, 61%, 12%)

Accessibility

WCAG contrast compliance

On White Background

4.31:1

AA AAA

On Black Background

4.87:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FDF2
100
#FAE0
200
#F6C6
300
#EF9A
400
#E765
500
#E038
600
#C21E
700
#9A18
800
#6E11
900
#470B
950
#2C07

Shades

Darker variations

1#DA2244
2#C21E3C
3#AA1B35
4#92172D
5#791326
6#610F1E
7#490B17
8#31080F
9#180408

Tints

Lighter variations

1#E34C68
2#E66079
3#E9748A
4#EC889A
5#F09CAB
6#F3B0BC
7#F6C3CD
8#F9D7DD
9#FCEBEE

Tones

Muted variations

1#D8415D
2#CF4962
3#C75267
4#BF5A6C
5#B66272
6#AE6B77
7#A5737C
8#9D7B82
9#958487

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF2
#FDF2F4
BackgroundsSubtle highlightsCard backgrounds
100
FAE0
#FAE0E5
Light backgroundsTable row hoverSkeleton loading
200
F6C6
#F6C6CF
Secondary backgroundsInput backgroundsDividers
300
EF9A
#EF9AA9
BordersInactive statesPlaceholder text
400
E765
#E7657C
Disabled statesSecondary iconsMuted text
500
E038
#E03857
Primary brand colorCTAsActive elementsLinks
600
C21E
#C21E3C
Hover statesFocus ringsPrimary buttons hover
700
9A18
#9A1830
Active/pressed statesDark mode accentsSecondary text
800
6E11
#6E1122
Text on light backgroundsHeadingsStrong borders
900
470B
#470B16
Primary textHigh emphasis contentDark headings
950
2C07
#2C070E
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --indian-red-50: #FDF2F4;
  --indian-red-100: #FAE0E5;
  --indian-red-200: #F6C6CF;
  --indian-red-300: #EF9AA9;
  --indian-red-400: #E7657C;
  --indian-red-500: #E03857;
  --indian-red-600: #C21E3C;
  --indian-red-700: #9A1830;
  --indian-red-800: #6E1122;
  --indian-red-900: #470B16;
  --indian-red-950: #2C070E;
}
Generate More ShadesCreate PaletteConvert Color