Purple

#8D03DD

Purple

Color Codes

All color formats for development

HEX

#8D03DD

RGB

rgb(141, 3, 221)

HSL

hsl(278, 97%, 44%)

OKLCH

oklch(0.515 0.266 305)

CMYK

cmyk(36%, 99%, 0%, 13%)

Accessibility

WCAG contrast compliance

On White Background

6.58:1

AA ✓AAA ✗

On Black Background

3.19:1

AA ✗AAA ✗

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#F9F0

100

#F2DC

200

#E6BE

300

#D48B

400

#BD4F

500

#AA1D

600

#8D03

700

#7003

800

#5002

900

#3301

950

#2001

Shades

Darker variations

1#7F03C7

2#7103B1

3#63029B

4#550285

5#47026F

6#380158

7#2A0142

8#1C012C

9#0E0016

Tints

Lighter variations

1#9F04F9

2#AA1EFC

3#B53AFC

4#BF56FC

5#CA72FD

6#D58EFD

7#DFABFE

8#EAC7FE

9#F4E3FF

Tones

Muted variations

1#8A0ED2

2#8719C7

3#8524BC

4#822FB2

5#7F3AA7

6#7C459C

7#795091

8#765A86

9#73657B

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	F9F0 `#F9F0FF`	BackgroundsSubtle highlightsCard backgrounds
100	F2DC `#F2DCFE`	Light backgroundsTable row hoverSkeleton loading
200	E6BE `#E6BEFE`	Secondary backgroundsInput backgroundsDividers
300	D48B `#D48BFD`	BordersInactive statesPlaceholder text
400	BD4F `#BD4FFC`	Disabled statesSecondary iconsMuted text
500	AA1D `#AA1DFC`	Primary brand colorCTAsActive elementsLinks
600	8D03 `#8D03DD`	Hover statesFocus ringsPrimary buttons hover
700	7003 `#7003B0`	Active/pressed statesDark mode accentsSecondary text
800	5002 `#50027E`	Text on light backgroundsHeadingsStrong borders
900	3301 `#330150`	Primary textHigh emphasis contentDark headings
950	2001 `#200132`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --purple-50: #F9F0FF;
  --purple-100: #F2DCFE;
  --purple-200: #E6BEFE;
  --purple-300: #D48BFD;
  --purple-400: #BD4FFC;
  --purple-500: #AA1DFC;
  --purple-600: #8D03DD;
  --purple-700: #7003B0;
  --purple-800: #50027E;
  --purple-900: #330150;
  --purple-950: #200132;
}

Generate More Shades Create Palette Convert Color