Skip to main content

RGB to HEX Converterv1.0.0

Converts among RGB (0-255 each), 3-digit or 6-digit HEX, and HSL (H 0-360, S and L 0-100); editing any one format updates the other two in real time. The HEX output case (uppercase vs lowercase) and the leading hash are independently toggleable. A swatch previews the current color, and clicking any of the three output values copies it to the clipboard.

Color
Web Development
CSS
Graphic Design
Reference

Documentation

Convert colors between RGB, HEX, and HSL formats using this free online converter. Enter values in any of the three color systems and the other two formats update automatically in real time. The tool is designed for web designers, graphic designers, front-end developers, and anyone who works with digital color values across different platforms and applications.

  • Enter Red, Green, and Blue values between 0 and 255 in the RGB fields to generate the corresponding HEX and HSL values.
  • Type a HEX Code (such as #FF5733 or FF5733) in the HEX field to convert it to RGB and HSL. Both 3-digit shorthand (such as #F00) and 6-digit codes are supported.
  • Enter Hue (0 to 360), Saturation (0 to 100), and Lightness (0 to 100) in the HSL fields to convert from HSL to RGB and HEX.
  • View the live Color Preview swatch to confirm the selected color visually before copying values.
  • Click Copy HEX, Copy RGB, or Copy HSL to copy the formatted color value to your clipboard for pasting into CSS, design tools, or documentation.
  • Toggle Uppercase HEX output in the Settings panel to switch between uppercase (#FF5733) and lowercase (#ff5733) formatting.
  • Toggle Include # prefix in HEX to control whether the hash symbol appears in the output value.
  • Click Reset to clear all values and restore the default black color (#000000).
  • Share a pre-filled color by adding query parameters to the URL, for example: ?r=255&g=87&b=51 or ?hex=FF5733.

The conversion uses standard color math. RGB to HEX maps each 0 to 255 channel to a two-digit hexadecimal pair, then concatenates them. HEX to RGB reverses that mapping. RGB to HSL normalizes the channels to 0 to 1, finds the minimum and maximum, and derives hue, saturation, and lightness from those values. HSL to RGB applies the inverse transform so changes to any single field stay consistent across all three representations.

Color conversion is a frequent task across many creative and technical disciplines. Use this converter whenever you need to translate a color value from one system to another quickly and accurately.

  • Web Development: Convert RGB values from a design mockup into HEX codes for CSS stylesheets. Paste the copied HEX value directly into your code editor to match the exact brand color specified by the design team.
  • Graphic Design: Translate HEX codes from a brand style guide into RGB values for use in Photoshop, Illustrator, or Figma. Ensure consistent color reproduction across all design deliverables.
  • UI and UX Design: Experiment with HSL values to adjust hue, saturation, and lightness independently. Find complementary or contrasting colors by shifting the hue while keeping saturation and lightness constant.
  • Accessibility Testing: Convert colors between formats to compare values against WCAG contrast ratio requirements. Verify that text and background color combinations meet accessibility standards by checking their numeric values.
  • Email Marketing: Look up HEX codes for inline CSS in HTML email templates where only HEX color values are reliably supported by most email clients.
  • Presentation Design: Match a specific color from a website or application by entering the RGB values and obtaining the HEX code for use in PowerPoint, Keynote, or Google Slides custom color pickers.
  • Game Development: Convert between color formats when working with engines that accept different color input types. Translate HEX values from asset libraries into RGB tuples for shader code.
  • Print Preparation: Identify the RGB equivalent of screen colors before converting to CMYK in professional print workflows. Use the preview swatch to visually confirm color accuracy before sending files to print.
Inputs, outputs, and what the RGB to HEX Converter computes

The form above accepts the following inputs and produces the outputs listed below. This summary is rendered in the page so the parameters are visible to crawlers, assistive tech, and indexing agents that don't fetch the embedded tool frame.

Inputs

  • Red (0–255) (numeric input) · default: 0 · range: 0 to 255
  • Green (0–255) (numeric input) · default: 0 · range: 0 to 255
  • Blue (0–255) (numeric input) · default: 0 · range: 0 to 255
  • HEX Code (text input) · default: #000000
  • Hue (0–360) (numeric input) · default: 0 · range: 0 to 360
  • Saturation (0–100%) (numeric input) · default: 0 · range: 0 to 100
  • Lightness (0–100%) (numeric input) · default: 0 · range: 0 to 100
  • Uppercase HEX output
  • Include # prefix in HEX

Controls

Convert · Reset

Worked example

Convert colors between RGB , HEX, and HSL formats using this free online converter.