Purple

#791AC7

Purple

Color Codes

All color formats for development

HEX

#791AC7

RGB

rgb(121, 26, 199)

HSL

hsl(273, 77%, 44%)

OKLCH

oklch(0.478 0.235 302.1)

CMYK

cmyk(39%, 87%, 0%, 22%)

Accessibility

WCAG contrast compliance

On White Background

7.54:1

AA ✓AAA ✓

On Black Background

2.79:1

AA ✗AAA ✗

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#F8F1

100

#EFDF

200

#E0C4

300

#C997

400

#AD61

500

#9534

600

#791A

700

#6015

800

#450F

900

#2C09

950

#1B06

Shades

Darker variations

1#6D17B3

2#61159F

3#55128B

4#490F77

5#3C0D63

6#300A4F

7#24083C

8#180528

9#0C0314

Tints

Lighter variations

1#881DE0

2#9635E5

3#A34EE8

4#B067EB

5#BD81EF

6#CA9AF2

7#D7B3F5

8#E5CCF8

9#F2E6FC

Tones

Muted variations

1#7822BE

2#772BB5

3#7634AD

4#753CA4

5#75459B

6#744E93

7#73568A

8#725F81

9#716879

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	F8F1 `#F8F1FD`	BackgroundsSubtle highlightsCard backgrounds
100	EFDF `#EFDFFB`	Light backgroundsTable row hoverSkeleton loading
200	E0C4 `#E0C4F7`	Secondary backgroundsInput backgroundsDividers
300	C997 `#C997F2`	BordersInactive statesPlaceholder text
400	AD61 `#AD61EA`	Disabled statesSecondary iconsMuted text
500	9534 `#9534E5`	Primary brand colorCTAsActive elementsLinks
600	791A `#791AC7`	Hover statesFocus ringsPrimary buttons hover
700	6015 `#60159E`	Active/pressed statesDark mode accentsSecondary text
800	450F `#450F71`	Text on light backgroundsHeadingsStrong borders
900	2C09 `#2C0948`	Primary textHigh emphasis contentDark headings
950	1B06 `#1B062D`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --purple-50: #F8F1FD;
  --purple-100: #EFDFFB;
  --purple-200: #E0C4F7;
  --purple-300: #C997F2;
  --purple-400: #AD61EA;
  --purple-500: #9534E5;
  --purple-600: #791AC7;
  --purple-700: #60159E;
  --purple-800: #450F71;
  --purple-900: #2C0948;
  --purple-950: #1B062D;
}

Generate More Shades Create Palette Convert Color