Is the Tailwind match for #A259FF accurate?

Yes, we use the CIEDE2000 ΔE algorithm which matches colors based on human perception. The distance of 3.47 indicates a very close match.

How do I use Figma Purple in Tailwind CSS v4?

You can use the native class bg-purple-500 or define a custom theme color in your CSS using the provided OKLCH values.

Browse Colors

Figma OrangePrev Color

32/177

Figma BlueNext Color

Figma Purple

Q: What is the closest Tailwind class for Figma Purple?

The closest visually matching Tailwind CSS class for Figma Purple (#A259FF) is purple-500. It has a perceptual match score of 96.5%.

#A259FF

Nearest Tailwind V4 Match

purple-500

96.5% Match

Implementation

bg-purple-500

text-purple-500

Color Code Conversions

HEX Code

#A259FF

RGB Value

rgb(162, 89, 255)

HSL Value

hsl(266, 100%, 67%)

OKLCH CSS (v4)

oklch(0.631 0.235 299.8)

Full Calculated Scale

#f8f0ff

100

#f3e0ff

200

#e7bfff

300

#d69eff

400

#b977ff

500

#9f55fb

600

#863bdd

700

#742bc2

800

#611da6

900

#531a8f

950

#360662

Technical Background

Converting Figma Purple (#A259FF) to Tailwind CSS requires more than just picking the nearest hex. Our algorithm uses CIEDE2000, a perceptual color difference formula that accounts for how human vision processes lightness, chroma, and hue.

The generated scale follows the Tailwind CSS v4 OKLCH standard, ensuring perfectly uniform weight across the entire spectrum. This prevents common issues like "hue shifting" where colors turn purple or grey as they get darker or lighter. You can customize this further in our Palette Generator.

Related & Brand Colors

Twitch Purple Brand

Medium Purple Classic

Stripe Purple

Violet Prime

Rebecca Purple Classic

Purple Tint

Explore More Colors

Teal Prime

Midnight Blue Classic

Figma Blue

Deep Sky Blue Classic

Ikea Yellow Brand

Lavender Rose

Frequently Asked Questions

What is the closest Tailwind class for Figma Purple?

The closest visually matching Tailwind CSS class for Figma Purple (#A259FF) is purple-500. Our algorithm calculates this using the CIEDE2000 ΔE standard, which shows a match score of 96.5%.

How do I use this color in my Tailwind config?

You have two options: use the native class bg-purple-500 for the best out-of-the-box match, or add #A259FF directly to your Tailwind theme configuration for 100% brand accuracy.

Why use OKLCH for this scale?

Tailwind CSS v4 uses OKLCH because it is perceptually uniform. When we generate the 50-950 scale for Figma Purple, OKLCH ensures that the color stays vibrant and doesn't shift towards different hues as it gets lighter or darker.

Need a custom palette?

Use our professional-grade generator to create a full theme from any custom hex code.

Open Generator