ToolBoxy
Sign up free
🎨

Color To Tailwind

color to tailwind

Color to Tailwind CSS

Find the closest Tailwind CSS color class for any hex color value

Best match

#3b82f6

blue-500

Top 5 Closest Colors

1

blue-500

#3b82f6 \u2022 \u03940

2

blue-600

#2563eb \u2022 \u039440

3

indigo-500

#6366f1 \u2022 \u039449

4

blue-400

#60a5fa \u2022 \u039451

5

indigo-600

#4f46e5 \u2022 \u039465

How to use

  1. 1

    Enter a hex color.

  2. 2

    See the closest Tailwind class.

  3. 3

    Copy the bg- or text- class.

FAQ

Is this tool free?

Yes — no sign-up, no installation, completely free to use right away.

What is this tool?

This tool is a handy color helper for developers — matching colors to the nearest Tailwind class or working out opacity values. It saves you guesswork while styling. Everything runs in your browser.