Purple

#8708AA

Pink

Color Codes

All color formats for development

HEX

#8708AA

RGB

rgb(135, 8, 170)

HSL

hsl(287, 91%, 35%)

OKLCH

oklch(0.465 0.223 316.2)

CMYK

cmyk(21%, 95%, 0%, 33%)

Accessibility

WCAG contrast compliance

On White Background

7.94:1

AA ✓AAA ✓

On Black Background

2.65:1

AA ✗AAA ✗

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#FBF0

100

#F6DD

200

#EFC0

300

#E38F

400

#D455

500

#C724

600

#AA0A

700

#8708

800

#6106

900

#3E04

950

#2702

Shades

Darker variations

1#7A0799

2#6C0688

3#5F0677

4#510566

5#440455

6#360344

7#290233

8#1B0222

9#0E0111

Tints

Lighter variations

1#A00ACA

2#BA0BEA

3#C721F5

4#CF41F6

5#D761F8

6#DF80F9

7#E7A0FB

8#EFC0FC

9#F7DFFE

Tones

Muted variations

1#8310A2

2#7E189A

3#792092

4#75298A

5#703182

6#6C397A

7#674172

8#624969

9#5E5161

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	FBF0 `#FBF0FE`	BackgroundsSubtle highlightsCard backgrounds
100	F6DD `#F6DDFD`	Light backgroundsTable row hoverSkeleton loading
200	EFC0 `#EFC0FC`	Secondary backgroundsInput backgroundsDividers
300	E38F `#E38FFA`	BordersInactive statesPlaceholder text
400	D455 `#D455F7`	Disabled statesSecondary iconsMuted text
500	C724 `#C724F5`	Primary brand colorCTAsActive elementsLinks
600	AA0A `#AA0AD6`	Hover statesFocus ringsPrimary buttons hover
700	8708 `#8708AA`	Active/pressed statesDark mode accentsSecondary text
800	6106 `#61067A`	Text on light backgroundsHeadingsStrong borders
900	3E04 `#3E044E`	Primary textHigh emphasis contentDark headings
950	2702 `#270231`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --purple-50: #FBF0FE;
  --purple-100: #F6DDFD;
  --purple-200: #EFC0FC;
  --purple-300: #E38FFA;
  --purple-400: #D455F7;
  --purple-500: #C724F5;
  --purple-600: #AA0AD6;
  --purple-700: #8708AA;
  --purple-800: #61067A;
  --purple-900: #3E044E;
  --purple-950: #270231;
}

Generate More Shades Create Palette Convert Color