HEX to Tailwind Color
Find the closest standard Tailwind CSS color corresponding to a HEX value.
Safe conversion with no data sent to server
Conversions
HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)
CMYKcmyk(76%, 47%, 0%, 4%)
Tailwindblue-500
CSS Var--color: #3B82F6;
What is Tailwind CSS?
Tailwind CSS is an incredibly popular utility-first CSS framework. Rather than writing custom CSS, you use specific predefined classes (`text-blue-500`, `bg-red-100`) to style elements directly in your HTML.
Why match to Tailwind palette?
Tailwind comes with an expertly crafted default color palette. When bringing an external design (say from Figma) into a Tailwind project, developers often want to stick to the framework's default palette to maintain consistency, keep the bundle size small, and avoid configuring arbitrary values. This tool instantly tells you which Tailwind class serves as the best substitute for a given HEX color.