Tailwind Color Converter

Your data stays in this browser.

Browse Tailwind CSS colors and convert a hex color to the closest Tailwind token.

Hex color

A three or six digit hex color.

Select a Tailwind color

Family

Shade

Select a Tailwind color or enter a hex value to inspect it.

Chromatic wheel

redorangeamberyellowlimegreenemeraldtealcyanskyblueindigovioletpurplefuchsiapinkrose

Neutral wheel

slategrayzincneutralstonetaupemauveolivemist

Black and white

Closest colors are selected using OKLab distance, which estimates perceived color difference. Hex values are sRGB approximations of Tailwind's OKLCH colors.

Includes colors introduced in Tailwind CSS 4.2 on Feb 2026.