Color Converter & Picker (Hex ↔ RGB ↔ HSL)

Real-time color conversion, preview, and HSL slider adjustment. Supports one-click copy.

Tool Overview

This tool converts between different color formats in real-time, providing visual previews and HSL sliders. Ideal for UI design and frontend development.

🎨 Color Picker / Hex Input

RGB Adjustment

HSL Slider Adjustment

Hue217°

Saturation85%

Lightness51%

HEX

#1a73e8

RGB

rgb(26, 115, 232)

HSL

hsl(217, 85%, 51%)

#1a73e8rgb(26, 115, 232)

Real-time Preview

Current Background Contrast: Dark Text / Light Text

How to use Color Converter?

1Click the color block in the 'Color Picker' area or type a Hex code (e.g., #FF5733).
2The tool instantly shows RGB, HSL, and CMYK values.
3Drag the HSL sliders to fine-tune Hue, Saturation, and Lightness.
4Click the 'Copy' button next to any value to save the color code.

Color Tool FAQ

What is HSL?

HSL stands for Hue, Saturation, and Lightness. It is more intuitive for humans to adjust colors compared to RGB.

Is CMYK supported?

Yes. While the tool is screen-based (RGB), we provide estimated CMYK values for print reference.