Purple

#720D54

Pink

Color Codes

All color formats for development

HEX

#720D54

RGB

rgb(114, 13, 84)

HSL

hsl(318, 80%, 25%)

OKLCH

oklch(0.376 0.149 344.1)

CMYK

cmyk(0%, 89%, 26%, 55%)

Accessibility

WCAG contrast compliance

On White Background

11.05:1

AA ✓AAA ✓

On Black Background

1.90:1

AA ✗AAA ✗

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#FDF1

100

#FBDF

200

#F8C3

300

#F395

400

#ED5E

500

#E830

600

#CA16

700

#A112

800

#730D

900

#4908

950

#2E05

Shades

Darker variations

1#670B4C

2#5C0A43

3#50093B

4#450832

5#39062A

6#2E0522

7#220419

8#170311

9#0B0108

Tints

Lighter variations

1#95116D

2#B81487

3#DA18A0

4#E830B1

5#EC53BE

6#F075CB

7#F498D8

8#F7BAE5

9#FBDDF2

Tones

Muted variations

1#6E1252

2#691750

3#631C4E

4#5E214C

5#59264A

6#542B48

7#4F3046

8#4A3644

9#453B42

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	FDF1 `#FDF1FA`	BackgroundsSubtle highlightsCard backgrounds
100	FBDF `#FBDFF3`	Light backgroundsTable row hoverSkeleton loading
200	F8C3 `#F8C3E8`	Secondary backgroundsInput backgroundsDividers
300	F395 `#F395D7`	BordersInactive statesPlaceholder text
400	ED5E `#ED5EC2`	Disabled statesSecondary iconsMuted text
500	E830 `#E830B1`	Primary brand colorCTAsActive elementsLinks
600	CA16 `#CA1694`	Hover statesFocus ringsPrimary buttons hover
700	A112 `#A11276`	Active/pressed statesDark mode accentsSecondary text
800	730D `#730D54`	Text on light backgroundsHeadingsStrong borders
900	4908 `#490836`	Primary textHigh emphasis contentDark headings
950	2E05 `#2E0522`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --purple-50: #FDF1FA;
  --purple-100: #FBDFF3;
  --purple-200: #F8C3E8;
  --purple-300: #F395D7;
  --purple-400: #ED5EC2;
  --purple-500: #E830B1;
  --purple-600: #CA1694;
  --purple-700: #A11276;
  --purple-800: #730D54;
  --purple-900: #490836;
  --purple-950: #2E0522;
}

Generate More Shades Create Palette Convert Color