Color Converter
Convert colors between HEX, RGB, RGBA, and HSL instantly. All inputs sync in real time, with a live preview and auto-generated tints and shades.
Frequently Asked Questions
What is the difference between HEX and RGB colors?
HEX colors represent the same red, green, and blue values as RGB but in a hexadecimal shorthand. For example, rgb(255, 87, 51) is the same as #FF5733. HEX is compact and common in HTML. RGB is more readable when you want to understand color composition at a glance, and also supports transparency through the rgba() function by adding an alpha channel.
What is HSL color format?
HSL stands for Hue, Saturation, and Lightness. Hue is a degree on the color wheel (0 = red, 120 = green, 240 = blue). Saturation runs from 0% (grayscale) to 100% (full color). Lightness goes from 0% (black) to 100% (white), with 50% being the pure hue. HSL is popular in CSS because you can lighten or darken a color just by adjusting the lightness value, without touching the other components.
How do I convert a color from Photoshop to CSS?
In Photoshop, open the Color Picker and copy the hex value shown in the # field. Paste it into the HEX field above (with the # prefix) and this tool will instantly show the equivalent rgb(), rgba(), and hsl() CSS values. Photoshop hex values map directly to CSS HEX colors with no adjustment needed.