Tailwind CSS uses a predefined color palette with specific hex values for each shade, and extending it with custom colors requires proper hex or RGB values in your configuration file. When a designer hands you a brand color as RGB or HSL, you need to convert it to a hex value for your tailwind.config.js custom colors section. This tool converts between formats and helps you work with colors in the context of Tailwind utility-first workflow.
Color Converter
Convert any color between HEX, RGB, HSL, and CMYK with a live preview, copy-able values, and a tints & shades strip.
#3B82F6rgb(59, 130, 246)hsl(217, 91%, 60%)cmyk(76%, 47%, 0%, 4%)HEX — 6-digit hexadecimal code used widely in web design (e.g., #FF5733).
RGB — Red, Green, Blue channels (0–255 each), the additive color model for screens.
HSL — Hue (0–360°), Saturation (0–100%), Lightness (0–100%). More intuitive for humans.
CMYK — Cyan, Magenta, Yellow, Key (Black) — the subtractive model used in printing.