How to Use
Type any color value in any field (HEX, RGB, or HSL) and press Enter or Tab. All other fields update automatically. Also use the color picker for visual selection.
Input Formats
HEX: enter with or without #, 6 digits (e.g., 1A56DB or #1A56DB). RGB: enter as rgb(26, 86, 219) or three comma-separated numbers. HSL: enter as hsl(220, 79%, 48%) or three comma-separated values.
Frequently Asked Questions
HEX is a six-digit hexadecimal color code (e.g., #1A56DB). RGB expresses a color as red, green, and blue values from 0-255. HSL expresses a color as hue (0-360 degrees), saturation (0-100%), and lightness (0-100%).
Split the six-digit HEX code into three pairs for red, green, and blue, then convert each pair from hexadecimal to decimal. For example, #1A56DB = R:26, G:86, B:219.
An alpha channel controls transparency. RGBA adds a fourth value from 0 (transparent) to 1 (opaque). HEX can include alpha as an 8-digit code, e.g., #1A56DBFF.
Yes. HEX as #1A56DB, RGB as rgb(26, 86, 219), and HSL as hsl(220, 79%, 48%) are all valid CSS color formats supported in all modern browsers.
HSL separates color identity (hue) from intensity (saturation) and brightness (lightness), making it easier to create color variations by changing only the lightness value.
Related Calculators
More tools in the Color & Design category.