Duronto Tech - Free Online Tools
Developer Tools

RGB to HEX

Convert RGB color values to HEX codes.

How to Use RGB to HEX

1

Paste your rgb() value, with commas or the modern space syntax, into the input field.

2

Alternatively use the three sliders or number boxes to pick red, green, and blue from 0 to 255.

3

Click the "Process" button to get the HEX code plus HSL and CMYK for the same colour.

4

Copy the #RRGGBB string into your stylesheet, config file, or design token JSON.

Features

Reads comma separated and space separated rgb() syntax, with or without the prefix
Colour pickers and numeric fields let you dial a value in visually
Offers three-digit shorthand when the result allows it
Reports the alpha from rgba() separately so nothing is silently discarded
Round-trips cleanly through the HEX to RGB converter with no drift
Displays a swatch and WCAG contrast so you can sanity-check the result

Frequently Asked Questions

Yes, free with no sign-up and no watermark, and the maths runs in your browser so the colour is never uploaded. Client brand colours and unreleased design systems stay entirely on your machine.
Yes. Percentages are scaled against the full 0 to 255 range before conversion, so a full red value of rgb(100%, 0%, 0%) correctly gives #FF0000. This matches how browsers interpret percentage colour values.
It is reported separately as an opacity value and is not folded into the hex result, because six-digit hex has no alpha channel. If you need transparency in hex, use the eight-digit form, which the tool shows alongside.
When each channel is a doubled digit, such as 255, 0, 51, the three-digit shorthand #F03 is exactly equivalent to #FF0033 and saves three characters. The tool offers that form whenever the full value allows it.

Related Tools

JSON Formatter

Format and beautify JSON data with proper indentation.

JSON Validator

Validate JSON data and find syntax errors.

JSON Minifier

Minify JSON by removing whitespace and formatting.

HTML Formatter

Format and beautify HTML code.

HTML Minifier

Minify HTML code to reduce file size.

CSS Formatter

Format and beautify CSS code.

About RGB to HEX

The reverse direction comes up just as often. A colour sampled from a screenshot, a value pulled from a design system in JavaScript, or a colour picked in a colour picker is naturally expressed as three channel numbers, and CSS or a design token file usually wants a single hex string. This converter turns rgb(74, 144, 226) into #4A90E2.

It reads both forms of the CSS syntax, so rgb(74, 144, 226) with commas and rgb(74 144 226) with spaces are both understood, with or without the rgb prefix. Percentage values such as rgb(29%, 56%, 88%) are also accepted and scaled to the 0 to 255 range first. Anything out of range is clamped rather than producing an invalid colour.

Output is exact integer maths, so a value round-trips cleanly: converting the result back gives you the same three channels. When every channel happens to be a repeated pair of digits, the three-digit shorthand is offered as well. HSL and CMYK are shown for the same colour because the next question is usually what to put in a print brief or a design token export.

When to Use This Tool

  • Turning a sampled or picked colour into a value for your stylesheet
  • Writing a colour into a Tailwind config, SCSS variable, or JSON token
  • Converting a JavaScript colour calculation into a static CSS value
  • Matching a screenshot colour to an existing design system colour
  • Reducing a verbose rgb() declaration to a shorter hex string