Indian Red

#DF473A

Red

Color Codes

All color formats for development

HEX
#DF473A
RGB
rgb(223, 71, 58)
HSL
hsl(5, 72%, 55%)
OKLCH
oklch(0.612 0.191 28.8)
CMYK
cmyk(0%, 68%, 74%, 13%)

Accessibility

WCAG contrast compliance

On White Background

4.12:1

AA AAA

On Black Background

5.10:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FDF3
100
#FAE2
200
#F6CA
300
#EFA1
400
#E670
500
#DF47
600
#C12D
700
#9A24
800
#6E1A
900
#4610
950
#2C0A

Shades

Darker variations

1#D93223
2#C12D1F
3#A9271B
4#912218
5#791C14
6#601610
7#48110C
8#300B08
9#180604

Tints

Lighter variations

1#E25A4D
2#E56C61
3#E97E75
4#EC9189
5#EFA39C
6#F2B6B0
7#F5C8C4
8#F9DAD8
9#FCEDEB

Tones

Muted variations

1#D74E42
2#CE554A
3#C65C52
4#BE635B
5#B66A63
6#AD716B
7#A57873
8#9D7E7C
9#958584

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF3
#FDF3F2
BackgroundsSubtle highlightsCard backgrounds
100
FAE2
#FAE2E0
Light backgroundsTable row hoverSkeleton loading
200
F6CA
#F6CAC6
Secondary backgroundsInput backgroundsDividers
300
EFA1
#EFA19A
BordersInactive statesPlaceholder text
400
E670
#E67065
Disabled statesSecondary iconsMuted text
500
DF47
#DF473A
Primary brand colorCTAsActive elementsLinks
600
C12D
#C12D1F
Hover statesFocus ringsPrimary buttons hover
700
9A24
#9A2419
Active/pressed statesDark mode accentsSecondary text
800
6E1A
#6E1A12
Text on light backgroundsHeadingsStrong borders
900
4610
#46100B
Primary textHigh emphasis contentDark headings
950
2C0A
#2C0A07
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --indian-red-50: #FDF3F2;
  --indian-red-100: #FAE2E0;
  --indian-red-200: #F6CAC6;
  --indian-red-300: #EFA19A;
  --indian-red-400: #E67065;
  --indian-red-500: #DF473A;
  --indian-red-600: #C12D1F;
  --indian-red-700: #9A2419;
  --indian-red-800: #6E1A12;
  --indian-red-900: #46100B;
  --indian-red-950: #2C0A07;
}
Generate More ShadesCreate PaletteConvert Color