Paste a color code
Enter any supported format: hex like #3b82f6, rgb like rgb(59, 130, 246), or hsl like hsl(217, 91%, 60%).
Image tools
Color Converter
Convert HEX, RGB, and HSL colors
Converted formats
The result will appear here after you run the tool.
Press Ctrl or Command and Enter to run the tool.
About this tool
About this tool
The color converter parses HEX, RGB, or HSL input and outputs the same color in all three formats with a live swatch. Conversion math runs locally in the browser and alpha values are preserved.
Designers and developers juggle color formats: CSS accepts HEX and HSL, design tools display RGB, and APIs return whichever format their author chose. This converter turns any of the three formats into all of them, with a live swatch so you can confirm the color at a glance.
Built for daily work
- Match a brand color from a design file into CSS variables.
- Convert an RGB value from a design tool into an HSL string for a color palette.
- Check how a hex code reads as RGB before writing an API payload.
- Normalize color formats across a shared design token file.
How to use this tool
How to use this tool
Run the conversion
The tool detects the format automatically and converts it in one step.
Read all three formats
HEX, RGB, and HSL appear together with a live swatch of the exact color.
Copy what you need
Copy the format your CSS, design tool, or API expects and paste it into your project.
Key features
Key features
All three formats in one result
Every conversion returns HEX, RGB, and HSL together, so you never convert twice.
Automatic format detection
Paste any supported format; no need to pick the input type first.
Alpha channel support
RGBA and HSLA values keep their transparency across every output format.
Live color swatch
The exact converted color is shown visually, so you can verify it instantly.
Practical use cases
Practical use cases
- Match a brand color from a design file into CSS variables.
- Convert an RGB value from a design tool into an HSL string for a color palette.
- Check how a hex code reads as RGB before writing an API payload.
- Normalize color formats across a shared design token file.
- Verify a picked color from an image with the color picker tool.
Private by default
For local tools, input is processed in your browser and is not sent to application analytics.
Data processing noticeTechnical details
Technical details
Input formatsHEX, HEX alpha, RGB, RGBA, HSL, HSLA
Output formatsHEX, RGB, HSL with alpha preserved
ProcessingLocal JavaScript color math
RoundingRGB and HSL components rounded to standard precision
Workspace featuresLive swatch, copy-ready values, text download
Limitations and important notes
Limitations and important notes
- Named colors such as "rebeccapurple" are not accepted; use hex, rgb, or hsl.
- CSS color functions like color-mix or oklch are not supported.
- The swatch preview depends on the color profile of your display.
Frequently asked questions
Frequently asked questions
HEX (with shorthand and alpha variants), RGB and RGBA, and HSL and HSLA. The input format is detected automatically.
Yes. The converter uses the standard color math between RGB and HSL, and HEX is the direct hex encoding of RGB, so values round-trip exactly.
Alpha is preserved: rgba(59, 130, 246, 0.5) becomes the matching HSLA and 8-digit hex forms.
No. All conversion math runs locally in your browser.
Related guides and solutions
Related guides and solutions
Convert a color code between HEX, RGB, and HSL
CSS, design tools, and APIs each prefer different color formats. The [color converter](tool:color-converter) turns any HEX, RGB, or HSL value into all three formats in one step, with a live swatch, entirely in your browser.
Learn moreHow to convert PNG to JPG without uploading your images
A practical guide to PNG to JPG conversion with the [PNG to JPG converter](tool:png-to-jpg): format differences, transparency handling, quality settings, and why converting locally is the private choice.
Learn moreWhat local browser processing means for online tools
A transparent explanation of local tool processing, temporary browser memory, local storage, downloads, analytics boundaries, and cases that require remote services.
Learn moreRelated tools
Related tools
Image tools
Image Color Picker
Pick pixel colors from uploaded images and get HEX, RGB, and HSL values.
Open toolImage tools
Image Converter
Convert images between JPG, PNG, WebP, and AVIF formats in your browser.
Open toolImage tools
Image to Base64 Converter
Encode images to base64 data URLs in your browser for embedding in HTML, CSS, JSON, and API payloads.
Open tool