Purple

#73189A

Purple

Color Codes

All color formats for development

HEX

#73189A

RGB

rgb(115, 24, 154)

HSL

hsl(282, 73%, 35%)

OKLCH

oklch(0.431 0.195 312.5)

CMYK

cmyk(25%, 84%, 0%, 40%)

Accessibility

WCAG contrast compliance

On White Background

9.03:1

AA ✓AAA ✓

On Black Background

2.33:1

AA ✗AAA ✗

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#FAF2

100

#F2E0

200

#E8C6

300

#D59A

400

#C065

500

#AE38

600

#911E

700

#7318

800

#5211

900

#350B

950

#2107

Shades

Darker variations

1#68168B

2#5C137C

3#51116C

4#450E5D

5#3A0C4D

6#2E0A3E

7#23072E

8#17051F

9#0C020F

Tints

Lighter variations

1#891DB7

2#9E21D4

3#AD36E0

4#B953E4

5#C470E9

6#D08CED

7#DCA9F2

8#E8C6F6

9#F3E2FB

Tones

Muted variations

1#711F94

2#6E258D

3#6B2C87

4#693280

5#66397A

6#643F73

7#61466D

8#5E4C66

9#5C5360

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	FAF2 `#FAF2FD`	BackgroundsSubtle highlightsCard backgrounds
100	F2E0 `#F2E0FA`	Light backgroundsTable row hoverSkeleton loading
200	E8C6 `#E8C6F6`	Secondary backgroundsInput backgroundsDividers
300	D59A `#D59AEF`	BordersInactive statesPlaceholder text
400	C065 `#C065E7`	Disabled statesSecondary iconsMuted text
500	AE38 `#AE38E0`	Primary brand colorCTAsActive elementsLinks
600	911E `#911EC2`	Hover statesFocus ringsPrimary buttons hover
700	7318 `#73189A`	Active/pressed statesDark mode accentsSecondary text
800	5211 `#52116E`	Text on light backgroundsHeadingsStrong borders
900	350B `#350B47`	Primary textHigh emphasis contentDark headings
950	2107 `#21072C`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --purple-50: #FAF2FD;
  --purple-100: #F2E0FA;
  --purple-200: #E8C6F6;
  --purple-300: #D59AEF;
  --purple-400: #C065E7;
  --purple-500: #AE38E0;
  --purple-600: #911EC2;
  --purple-700: #73189A;
  --purple-800: #52116E;
  --purple-900: #350B47;
  --purple-950: #21072C;
}

Generate More Shades Create Palette Convert Color