Skip to main content

Web Tools

Color Converter

Convert and preview HEX, RGB, and HSL colors.

Color Converter tool

Loading tool…

Jump to a section

About This Tool

Translate a web color between hexadecimal, RGB, and HSL representations while seeing the actual color alongside the numeric values. This is useful when CSS, design tools, documentation, or APIs express the same color in different formats. You can edit RGB or HSL channels directly and copy CSS-ready output; all conversion happens locally in your browser.

How To Use It

  1. Enter a 3- or 6-digit HEX color, with or without the # prefix.
  2. Review the normalized HEX value, RGB channels, HSL channels, and visual preview.
  3. Adjust an RGB or HSL channel to update the color while staying within that format's valid range.
  4. Copy the HEX, rgb(), or hsl() value for use in CSS or another tool.

Examples

HEX to RGB

#336699 converts to rgb(51, 102, 153).

Short HEX

#0F8 expands to #00FF88 before conversion, because each shorthand digit is duplicated.

Primary red

#FF0000 is rgb(255, 0, 0) and hsl(0, 100%, 50%).

Useful Notes

HEX and RGB describe the same channels

Six-digit HEX stores red, green, and blue as hexadecimal channel values from 00 through FF. RGB expresses those same channels as decimal integers from 0 through 255. Three-digit HEX is shorthand: #ABC expands to #AABBCC.

How HSL differs

HSL describes a color using hue, saturation, and lightness. Hue is an angle around the color wheel, while saturation controls color intensity and lightness moves between black and white. HSL can be easier to adjust conceptually even though browsers ultimately render color channels.

Rounding in HSL conversions

RGB channels are integers, but an equivalent HSL value can contain decimals. The interface displays HSL channels to two decimal places. Converting an edited HSL value back to RGB rounds each resulting channel to the nearest integer from 0 to 255.

This tool handles opaque colors

The converter focuses on HEX, RGB, and HSL colors without alpha transparency. Eight-digit HEX, rgba(), and hsla() introduce an additional alpha channel and are intentionally outside this tool's current scope.

Color values do not guarantee visual accessibility

Conversion preserves the color representation; it does not determine whether foreground/background combinations meet contrast requirements. Contrast depends on two colors and the applicable accessibility criterion.

FAQ

Is #FFF the same as #FFFFFF?

Yes. Three-digit HEX duplicates each digit, so #FFF expands to #FFFFFF.

Why can HSL contain decimals?

The mathematical conversion from integer RGB channels can produce fractional hue, saturation, or lightness values. Display rounding makes those values easier to read.

Does changing format change the actual color?

Not when the values are exact equivalents. HEX, RGB, and HSL are different ways to describe a color. Small differences can appear after editing rounded HSL values because RGB channels must be whole numbers.

Does Hanakash upload the color I enter?

No. This converter performs its calculations in the browser and does not need to send the color to a conversion service.