Hex Color Calculator | RGB HSL Converter

Hex Color Calculator

Convert between HEX, RGB, and HSL color formats

A hex color code is a six-digit hexadecimal value (e.g., #3b82f6) that encodes a color as three two-digit pairs representing the red, green, and blue components on a 0–255 scale.

Color Converter

#3b82f6
59, 130, 246
RGB
217°, 91%, 60%
HSL
3,899,126
Decimal

RGB Sliders

Frequently Asked Questions

How do I convert a hex color code to RGB?

Split the six-digit hex into three pairs and convert each from base-16 to decimal. For #3b82f6: 3B = 59 red, 82 = 130 green, F6 = 246 blue, giving RGB(59, 130, 246). The calculator does this instantly and also outputs the HSL and decimal equivalents.

What is HSL and how does it differ from RGB?

HSL stands for Hue, Saturation, Lightness. Hue is the color angle on a 360° wheel (0° = red, 120° = green, 240° = blue), saturation is color intensity (0–100%), and lightness is brightness (0% = black, 100% = white). RGB mixes light channels directly, while HSL is more intuitive for human color reasoning.

Can I use a 3-digit hex color code?

Yes. A 3-digit hex like #3bf is shorthand for #33bbff — each digit is simply doubled. The calculator accepts 3-digit codes and expands them automatically. Both formats are valid CSS color specifications.

What does the decimal value of a hex color represent?

The decimal is the integer interpretation of the full 6-digit hex number. For #3b82f6: (59 × 65536) + (130 × 256) + 246 = 3,899,126. This single number uniquely encodes the color and is sometimes used in programming contexts instead of the hex string.

Why do two hex colors look similar but have very different hex codes?

Small changes in one channel (especially red or green, which the eye is most sensitive to) can look subtle while producing very different hex strings. Additionally, nearby hues that differ in lightness or saturation can share similar hex code digits but appear quite different. Use the HSL output to compare hue, saturation, and lightness independently.