Dark Red

#800035

Pink

Color Codes

All color formats for development

HEX
#800035
RGB
rgb(128, 0, 53)
HSL
hsl(335, 100%, 25%)
OKLCH
oklch(0.385 0.154 7.2)
CMYK
cmyk(0%, 100%, 59%, 50%)

Accessibility

WCAG contrast compliance

On White Background

10.66:1

AA AAA

On Black Background

1.97:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FFF0
100
#FFDB
200
#FFBD
300
#FF8A
400
#FF4D
500
#FF1A
600
#E000
700
#B300
800
#8000
900
#5200
950
#3300

Shades

Darker variations

1#730030
2#66002A
3#590025
4#4D0020
5#40001B
6#330015
7#260010
8#1A000B
9#0D0005

Tints

Lighter variations

1#A60045
2#CC0055
3#F20065
4#FF1A79
5#FF408F
6#FF66A6
7#FF8CBC
8#FFB3D2
9#FFD9E9

Tones

Muted variations

1#790636
2#730D37
3#6C1338
4#661939
5#60203A
6#59263B
7#532D3D
8#4D333E
9#46393F

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FFF0
#FFF0F6
BackgroundsSubtle highlightsCard backgrounds
100
FFDB
#FFDBEA
Light backgroundsTable row hoverSkeleton loading
200
FFBD
#FFBDD8
Secondary backgroundsInput backgroundsDividers
300
FF8A
#FF8ABB
BordersInactive statesPlaceholder text
400
FF4D
#FF4D97
Disabled statesSecondary iconsMuted text
500
FF1A
#FF1A79
Primary brand colorCTAsActive elementsLinks
600
E000
#E0005E
Hover statesFocus ringsPrimary buttons hover
700
B300
#B3004A
Active/pressed statesDark mode accentsSecondary text
800
8000
#800035
Text on light backgroundsHeadingsStrong borders
900
5200
#520022
Primary textHigh emphasis contentDark headings
950
3300
#330015
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --dark-red-50: #FFF0F6;
  --dark-red-100: #FFDBEA;
  --dark-red-200: #FFBDD8;
  --dark-red-300: #FF8ABB;
  --dark-red-400: #FF4D97;
  --dark-red-500: #FF1A79;
  --dark-red-600: #E0005E;
  --dark-red-700: #B3004A;
  --dark-red-800: #800035;
  --dark-red-900: #520022;
  --dark-red-950: #330015;
}
Generate More ShadesCreate PaletteConvert Color