Can this tool convert shorthand hex like #ABC?

Yes. Shorthand hex codes like #ABC are automatically expanded to their full 6-digit form (#AABBCC) and then converted to RGB and HSL. The tool also handles hex with alpha channel (#RRGGBBAA).

Does the color converter support alpha/opacity?

Yes. The tool reads alpha values from hex8 (#RRGGBBAA) and rgba() inputs. The alpha value (0-1) is shown alongside the RGB output as rgba().

Color Converter - HEX to RGB, RGB to HSL, Color Converter Online

Color Converter — Free Online Tool
Converts colors between HEX, RGB, and HSL formats. Enter any color format and see all other formats instantly. Includes a color picker for visual selection and live preview. All processing happens in your browser — no data is ever sent to any server. Enable JavaScript to use the interactive tool.

WCAG Contrast Checker

Check if your text and background colors meet accessibility standards.

TEXT COLOR

BACKGROUND

Large Text
Normal text sample for contrast testing

Contrast Ratio

How to Use This Color Converter

Enter any color — Type or paste a color in HEX (#ff6600, #f60), RGB (rgb(255,102,0)), or HSL (hsl(24,100%,50%)) format. The tool auto-detects the format.
Or use the color picker — Click the color swatch to open your browser's native color picker and visually select any color.
See all formats — Results appear instantly in all three formats: HEX, RGB, and HSL, plus a live color preview.
Copy any value — Click the Copy button next to any format to copy it to your clipboard.

Why Use This Color Converter?

All three formats in one place

Most converters only show HEX and RGB. This tool shows HEX, RGB, and HSL simultaneously — and lets you input in any of the three. No switching modes, no guesswork.

Complete privacy

All conversions run in your browser. Your color values never leave your device — no server uploads, no tracking, no logs. Useful when working with brand colors under NDA.

Visual color picker

Click the color swatch to open your browser's native color picker. Visually select any color and get instant values in all three formats — ideal for matching colors from a design mockup or inspiration.

Flexible input parsing

Supports shorthand hex (#f60 → #ff6600), hex with alpha (#ff6600cc), rgb/rgba, hsl/hsla, and even CSS color keywords like tomato and dodgerblue.

Frequently Asked Questions

What is the difference between HEX, RGB, and HSL?

HEX (#ff6600) is a compact 6-character hexadecimal format used widely in web design and CSS. RGB (rgb(255,102,0)) uses decimal values (0-255) for each channel. HSL (hsl(24,100%,50%)) uses hue (0-360° on the color wheel), saturation (0-100%), and lightness (0-100%) — this is often more intuitive because it maps to how humans perceive color.

How do I convert a hex color to RGB manually?

Split the hex code into three pairs: #ff6600 becomes ff (red), 66 (green), 00 (blue). Convert each pair from hex to decimal: ff=255, 66=102, 00=0. Result: rgb(255,102,0). But why do it manually? This tool does it instantly.

Can I input named CSS colors?

Yes. Common CSS named colors like tomato, dodgerblue, mediumseagreen, and 148 others are recognized and converted to all formats. This uses a browser-native color parsing trick, so it works with any valid CSS color value.

Is this tool free?

Yes, completely free. No signup, no download, no limits.

More Free Tools

Browse other free online tools from TryTools — all run in your browser with no signup required.

🏠 Back to All Tools ⏰ Timestamp Converter { JSON Formatter 💾 Base64 Encoder 🔗 URL Encoder 🎀 UUID Generator ✍ Word Counter ✎ Case Converter