Purple

#B10294

Pink

Color Codes

All color formats for development

HEX

#B10294

RGB

rgb(177, 2, 148)

HSL

hsl(310, 98%, 35%)

OKLCH

oklch(0.517 0.226 337.8)

CMYK

cmyk(0%, 99%, 16%, 31%)

Accessibility

WCAG contrast compliance

On White Background

6.35:1

AA ✓AAA ✗

On Black Background

3.31:1

AA ✗AAA ✗

Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

Copy

CopyBase

Copy

#FFF0

100

#FFDC

200

#FEBD

300

#FE8B

400

#FD4E

500

#FD1C

600

#DE02

700

#B102

800

#7E01

900

#5101

950

#3201

Shades

Darker variations

1#9F0285

2#8D0176

3#7C0167

4#6A0159

5#58014A

6#47013B

7#35012C

8#23001E

9#12000F

Tints

Lighter variations

1#D202AF

2#F202CA

3#FD19D7

4#FD3ADD

5#FD5BE2

6#FE7CE8

7#FE9DEE

8#FEBDF4

9#FFDEF9

Tones

Muted variations

1#A80B8E

2#9F1388

3#961C82

4#8E257C

5#852E76

6#7C3671

7#733F6B

8#6B4865

9#62515F

Usage Guidelines

Recommended use cases for each shade level

Level	Color	Typical Use Cases
50	FFF0 `#FFF0FC`	BackgroundsSubtle highlightsCard backgrounds
100	FFDC `#FFDCF9`	Light backgroundsTable row hoverSkeleton loading
200	FEBD `#FEBDF4`	Secondary backgroundsInput backgroundsDividers
300	FE8B `#FE8BEB`	BordersInactive statesPlaceholder text
400	FD4E `#FD4EE0`	Disabled statesSecondary iconsMuted text
500	FD1C `#FD1CD7`	Primary brand colorCTAsActive elementsLinks
600	DE02 `#DE02BA`	Hover statesFocus ringsPrimary buttons hover
700	B102 `#B10294`	Active/pressed statesDark mode accentsSecondary text
800	7E01 `#7E0169`	Text on light backgroundsHeadingsStrong borders
900	5101 `#510143`	Primary textHigh emphasis contentDark headings
950	3201 `#32012A`	Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --purple-50: #FFF0FC;
  --purple-100: #FFDCF9;
  --purple-200: #FEBDF4;
  --purple-300: #FE8BEB;
  --purple-400: #FD4EE0;
  --purple-500: #FD1CD7;
  --purple-600: #DE02BA;
  --purple-700: #B10294;
  --purple-800: #7E0169;
  --purple-900: #510143;
  --purple-950: #32012A;
}

Generate More Shades Create Palette Convert Color