Dark Red

#6E1119

Red

Color Codes

All color formats for development

HEX
#6E1119
RGB
rgb(110, 17, 25)
HSL
hsl(355, 73%, 25%)
OKLCH
oklch(0.351 0.126 22.8)
CMYK
cmyk(0%, 85%, 77%, 57%)

Accessibility

WCAG contrast compliance

On White Background

11.95:1

AA AAA

On Black Background

1.76: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#630F16
2#580E14
3#4D0C11
4#420A0F
5#37090C
6#2C070A
7#210507
8#160305
9#0B0202

Tints

Lighter variations

1#8F1620
2#B01C28
3#D2212F
4#E03846
5#E55A65
6#EA7B84
7#F09CA3
8#F5BDC1
9#FADEE0

Tones

Muted variations

1#6A161D
2#651B21
3#601F25
4#5C2428
5#57282C
6#522D30
7#4E3234
8#493638
9#443B3C

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF2
#FDF2F3
BackgroundsSubtle highlightsCard backgrounds
100
FAE0
#FAE0E2
Light backgroundsTable row hoverSkeleton loading
200
F6C6
#F6C6CA
Secondary backgroundsInput backgroundsDividers
300
EF9A
#EF9AA1
BordersInactive statesPlaceholder text
400
E765
#E7656F
Disabled statesSecondary iconsMuted text
500
E038
#E03846
Primary brand colorCTAsActive elementsLinks
600
C21E
#C21E2C
Hover statesFocus ringsPrimary buttons hover
700
9A18
#9A1823
Active/pressed statesDark mode accentsSecondary text
800
6E11
#6E1119
Text on light backgroundsHeadingsStrong borders
900
470B
#470B10
Primary textHigh emphasis contentDark headings
950
2C07
#2C070A
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --dark-red-50: #FDF2F3;
  --dark-red-100: #FAE0E2;
  --dark-red-200: #F6C6CA;
  --dark-red-300: #EF9AA1;
  --dark-red-400: #E7656F;
  --dark-red-500: #E03846;
  --dark-red-600: #C21E2C;
  --dark-red-700: #9A1823;
  --dark-red-800: #6E1119;
  --dark-red-900: #470B10;
  --dark-red-950: #2C070A;
}
Generate More ShadesCreate PaletteConvert Color