Purple

#A106AC

Pink

Color Codes

All color formats for development

HEX

#A106AC

RGB

rgb(161, 6, 172)

HSL

hsl(296, 93%, 35%)

OKLCH

oklch(0.506 0.234 324.8)

CMYK

cmyk(6%, 97%, 0%, 33%)

Accessibility

WCAG contrast compliance

On White Background

6.69:1

AA ✓AAA ✗

On Black Background

3.14:1

AA ✗AAA ✗

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#FEF0

100

#FCDD

200

#F9BF

300

#F48E

400

#EE53

500

#E922

600

#CB08

700

#A106

800

#7304

900

#4A03

950

#2E02

Shades

Darker variations

1#91069B

2#81058A

3#710479

4#610467

5#510356

6#400245

7#300234

8#200122

9#100111

Tints

Lighter variations

1#BF07CC

2#DD09EC

3#E81FF7

4#EC3FF8

5#EF5FF9

6#F27FFA

7#F59FFC

8#F9BFFD

9#FCDFFE

Tones

Muted variations

1#9A0FA4

2#93179C

3#8C1F93

4#84278B

5#7D3083

6#76387A

7#6F4072

8#68496A

9#605162

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	FEF0 `#FEF0FE`	BackgroundsSubtle highlightsCard backgrounds
100	FCDD `#FCDDFE`	Light backgroundsTable row hoverSkeleton loading
200	F9BF `#F9BFFD`	Secondary backgroundsInput backgroundsDividers
300	F48E `#F48EFB`	BordersInactive statesPlaceholder text
400	EE53 `#EE53F9`	Disabled statesSecondary iconsMuted text
500	E922 `#E922F7`	Primary brand colorCTAsActive elementsLinks
600	CB08 `#CB08D9`	Hover statesFocus ringsPrimary buttons hover
700	A106 `#A106AC`	Active/pressed statesDark mode accentsSecondary text
800	7304 `#73047B`	Text on light backgroundsHeadingsStrong borders
900	4A03 `#4A034F`	Primary textHigh emphasis contentDark headings
950	2E02 `#2E0231`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --purple-50: #FEF0FE;
  --purple-100: #FCDDFE;
  --purple-200: #F9BFFD;
  --purple-300: #F48EFB;
  --purple-400: #EE53F9;
  --purple-500: #E922F7;
  --purple-600: #CB08D9;
  --purple-700: #A106AC;
  --purple-800: #73047B;
  --purple-900: #4A034F;
  --purple-950: #2E0231;
}

Generate More Shades Create Palette Convert Color