Color Format Converter
Convert colors between HEX, RGB, and HSL formats with a live preview swatch.
The Color Format Converter auto-detects the input format (HEX, RGB, or HSL) and converts it to all three formats simultaneously, displaying a live color preview swatch. Supports shorthand hex (#abc), full hex (#aabbcc), rgb(r,g,b), and hsl(h,s%,l%) notation. Useful for CSS, design systems, and front-end development.
HEX#E8590C
RGBrgb(232, 89, 12)
HSLhsl(21, 90%, 48%)
Related Tools
FAQ
- What color formats does this tool support?
- The tool accepts HEX (#rrggbb or #rgb), RGB (rgb(r, g, b) where values are 0–255), and HSL (hsl(h, s%, l%) where hue is 0–360 and saturation/lightness are percentages). It auto-detects the format and outputs all three.
- How is HSL different from RGB?
- RGB describes colors by the intensity of red, green, and blue channels (0–255 each). HSL describes colors by hue (the color wheel angle 0–360°), saturation (colorfulness 0–100%), and lightness (brightness 0–100%). HSL is often more intuitive for humans to reason about.
- How does the tool auto-detect the input format?
- The tool first checks if the input starts with # (hex), then checks for the pattern rgb( (RGB), then hsl( (HSL). If none match, it shows an invalid input message. Whitespace and case are normalized before parsing.