HEX to RGB color converter
Convert HEX to RGB, RGB to HEX, or HSL in seconds. Paste a color code, fine-tune the shade, and copy the format your next project needs.
One color. Every format.
Paste a HEX, RGB, or HSL color. Get the code you need instantly.
Supports 3- or 6-digit HEX, RGB channels or percentages, and HSL.
Selected color
Ready to copyCMYK is an estimate. Printed colors depend on your printer and color profile.
Text contrast preview
On white · 8.07:1
AA normal text passes
On black · 2.60:1
AA normal text fails
Selected color
Ready to copyCMYK is an estimate. Printed colors depend on your printer and color profile.
Screen picking isn’t available in this browser. Upload a screenshot to sample it instead.
Recent picks
Your picked colors will stay here while you explore.
Common HEX to RGB conversions
The same colors, written three ways. HSL is rounded to one decimal place.
| Color | HEX | RGB | HSL |
|---|---|---|---|
| Black | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) |
| White | #FFFFFF | rgb(255, 255, 255) | hsl(0, 0%, 100%) |
| Red | #FF0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) |
| Green | #00FF00 | rgb(0, 255, 0) | hsl(120, 100%, 50%) |
| Blue | #0000FF | rgb(0, 0, 255) | hsl(240, 100%, 50%) |
| Krumzi purple | #5A17DD | rgb(90, 23, 221) | hsl(260.3, 81.1%, 47.8%) |
| Krumzi orange | #F98F03 | rgb(249, 143, 3) | hsl(34.1, 97.6%, 49.4%) |
| Gray | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50.2%) |
How to convert HEX to RGB
- 1
Paste a color code
Enter a HEX value such as #5A17DD into Your color. Three-digit HEX values such as #F90 also work. You can enter RGB or HSL when converting in the other direction.
- 2
Read the converted values
The selected color panel updates instantly. For #5A17DD, the RGB result is rgb(90, 23, 221). HEX, HSL, HSB, OKLCH, and estimated CMYK appear alongside it.
- 3
Adjust or copy your color
Use the visual picker or red, green, and blue sliders to adjust the shade. Click Copy RGB, Copy HEX, or another format's copy button to put the value on your clipboard.
How HEX to RGB conversion works
A six-digit HEX color contains three pairs of hexadecimal digits. The first pair is red, the second is green, and the third is blue. Each pair represents a number from 00 to FF in base 16, equivalent to 0 through 255 in decimal. Converting a HEX code to RGB changes how those same channel values are written.
For #5A17DD, split the code into 5A, 17, and DD. The red channel is 5 × 16 + 10 = 90. Green is 1 × 16 + 7 = 23. Blue is 13 × 16 + 13 = 221. The result is rgb(90, 23, 221). Converting back produces the original HEX value without losing any color information.
RGB to HEX and shorthand HEX
To convert RGB to HEX, write each channel as a two-digit hexadecimal number and join the results after a hash. rgb(255, 153, 0) becomes #FF9900: 255 is FF, 153 is 99, and 0 is 00. Keep the leading zero in a pair, so a channel of 3 becomes 03.
Three-digit HEX repeats each digit to form its pair. #F90 means #FF9900, and #ABC means #AABBCC. Shorthand only works when both digits in every pair are identical. #5A17DD can't be shortened to three digits. The converter always displays the full six-digit value so it is ready for other design tools.
When to use HEX, RGB, or HSL
HEX is compact and common in stylesheets, brand guides, and design software. RGB is useful when you are working directly with red, green, and blue channels. In CSS, #FF9900 and rgb(255, 153, 0) describe the same opaque sRGB color; choosing one doesn't make the color more accurate.
HSL describes hue, saturation, and lightness. It is easier to adjust by hand when you want a lighter or less saturated version of a color. Hue is an angle around the color wheel: 0° is red, 120° is green, and 240° is blue. Saturation and lightness use percentages. HSL values are rounded for readability, which can introduce a small difference if you repeatedly convert between formats.
Check the color before you use it for text
The converter previews your selected color as text on white and black backgrounds and calculates each contrast ratio. A ratio of at least 4.5:1 meets WCAG AA for normal text. A saturated color can look striking as a large shape and still be difficult to read as a small label.
These previews check only the two backgrounds shown. If your design uses a different background, test that actual foreground and background pair before choosing a text color. You can adjust the RGB sliders to explore the shade while watching both the converted values and the previews update.
Your questions, answered.
How do I convert a HEX color to RGB?
Paste a three- or six-digit HEX code into the converter. The RGB row immediately shows the red, green, and blue channels. For example, #FF9900 converts to rgb(255, 153, 0).
Can I convert RGB to HEX with this tool?
Yes. Enter an RGB value such as rgb(90, 23, 221), and the HEX result is #5A17DD. You can also enter percentage channels such as rgb(100% 0% 50%).
Can I convert HSL to HEX or RGB?
Yes. Enter an HSL color such as hsl(120, 100%, 50%). The result is #00FF00 and rgb(0, 255, 0). Hue can use degrees; saturation and lightness must include percent signs.
Does changing a color format change the color?
HEX and integer RGB preserve the same 8-bit sRGB channel values. HSL, HSB, and OKLCH are rounded for display, so converting rounded values back can cause a small difference. CMYK is an estimate and isn't a printer-profile conversion.
Does the converter support transparency or named colors?
The converter accepts opaque three- or six-digit HEX, RGB, and HSL. It doesn't accept alpha channels, eight-digit HEX, RGBA, HSLA, or named colors. Invalid input leaves the last valid result in place while you edit.
Can I get a HEX code from an image instead?
Yes. Choose the Image picker tab, add your image, and click a pixel. Its HEX, RGB, HSL, and other values appear in the selected color panel. Your selected color carries across the tabs.
More free tools you'll like
Built by Krumzi. All free, no signup.
Calculate any ratio, resize images without distortion, export social-ready sizes for every platform.
Pull HEX, RGB, HSL, HSB, OKLCH, and CMYK out of any image. Auto-extracts the dominant palette.
Extract up to 12 distinct colors from a picture. Download a PNG palette, CSS, or JSON.
Build vibrant gradient backgrounds. Start from a preset, then export PNG, SVG, or CSS.
Looping animated gradient backgrounds for slides, intros, and reels.
Slick number animations for milestones and stats. Export MP4.
Wrap product screenshots in animated gradients. Perfect for launches.
This Free Tool Is Just the Start
Krumzi designs complete social media graphics and videos from a text description. No templates. No design skills. Just describe what you want and watch AI build it.
Every layout decision. Every color choice. Every font and composition. Done in seconds. Fully editable. Fully yours.