Click to open color picker
Enter a six digit hexadecimal color or use the color picker, then read the RGB and HSL outputs beside the swatch. The example below uses pure red so each channel is easy to verify. Copy the representation required by your stylesheet or design application rather than mixing values from different fields. Check the swatch after every edit to catch a missing digit or an unintended color.
Use the contrast controls to compare foreground and background colors in context. A numeric conversion does not account for every display's calibration or color profile, so it cannot guarantee identical appearance on different devices. HSL values are rounded for display and may not round trip to precisely the same channel values. Save the original hexadecimal value when exact channel matching matters across several conversions.
HEX: #FF0000
RGB: rgb(255, 0, 0)
HSL: hsl(0, 100%, 50%)
RGB uses decimal numbers (0-255) for red, green, and blue values, while HEX uses hexadecimal notation (00-FF). Both represent the same colors but in different formats. HEX is more compact and commonly used in web design.
Use CMYK for print materials like business cards, brochures, and posters. CMYK represents how ink colors mix on paper (subtractive color), while RGB is for screens (additive color). Colors may look different between formats.
Check contrast ratios using our built-in accessibility checker. Aim for at least 4.5:1 for normal text and 3:1 for large text. Also test your design with color blindness simulators and ensure information isn't conveyed by color alone.
Yes! Our converter provides color codes formatted for popular design tools including Photoshop, Illustrator, Sketch, Figma, CSS, Swift, and Android development. Simply copy the format you need.
HSL describes hue, saturation, and lightness and is useful for adjusting related colors. Displayed conversions use rounded values, so repeated conversions can introduce small differences. Screens, calibration, and color profiles affect appearance. Retain the original channel value when exact matching matters, and test actual foreground/background combinations rather than judging the swatch alone.