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.
Describe your flyer and watch Krumzi design it from scratch. Free, no signup, fully editable.
Describe your story and get a 9:16 design in about a minute. Free, no signup, fully editable.
Describe your poster and watch Krumzi design it from scratch. Free, no signup, fully editable.
Resize one image for every social feed. Crop or fit, save PNG or JPG, and download several sizes in a ZIP.
Calculate any ratio, resize without distortion, or drop an image and download social-ready sizes for every platform.
Celebrate milestones and grab attention on social media with animated counter videos. Export as MP4 or GIF.
Turn screenshots into stunning videos with animated gradient backgrounds. Perfect for product showcases.
Start with 12 presets or your own colors. Shuffle the layout and export mesh gradients as PNG, SVG, or CSS.
Create animated gradient video backgrounds for your social media content and marketing videos.
Pick exact colors from any image with a pixel magnifier. Copy HEX, RGB, HSL, and more. Free, private, no signup.
Turn a photo or logo into a palette of up to 12 colors. Download a labeled PNG, CSS variables, or JSON.
Turn a URL or text into a QR code. Choose your colors and download PNG or SVG. Free, with no expiry.
This Free Tool Is Just the Start
Krumzi designs finished, editable social posts, flyers, posters and videos from one sentence. 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.
Related reading
Still picking a design tool? These two settle the Canva question.
- Canva alternatives15 tools tested, free and paid, ranked by what they are actually good at.
- Krumzi vs CanvaSide by side on process, editing, brand and price.