🎨

Color Converter

Convert colors between HEX, RGB, HSL and HSV formats instantly.

Click to pick any color

HEX RGB

R (0–255)

G (0–255)

B (0–255)

HSL

H (0–360°)

S (0–100%)

L (0–100%)

CSS Values

What is this tool?

A color converter is a free online tool for designers and developers that converts colour values between HEX, RGB and HSL formats instantly. Enter a colour in any format and get the equivalent values in all others — perfect for web development, CSS styling and graphic design work.

How to Use

Enter a colour valueType a HEX code (e.g. #5b4ef0), an RGB value (e.g. rgb(91, 78, 240)) or an HSL value (e.g. hsl(245, 85%, 62%)).

View all format equivalentsAll three colour formats update instantly — copy whichever format you need for your project.

Use the colour pickerClick the colour picker to visually select any colour and get its values in all three formats simultaneously.

Common Uses

💻

Web Development

Convert between HEX and RGB for CSS stylesheets and between RGB and HSL for dynamic colour calculations in JavaScript.

🎨

Graphic Design

Convert colours between design tool formats (Figma uses HEX and RGB) to maintain consistency across tools.

🖨️

Print Design

Convert RGB screen colours to understand their print representation (note: use CMYK converter for printing).

📱

App Development

Use RGB values for mobile app colour properties in Swift (iOS) and Android XML layouts.

Frequently Asked Questions

What is HEX colour?

HEX (hexadecimal) colour is a 6-character code representing red, green and blue values. Example: #FF5733 = Red 255, Green 87, Blue 51.

What is RGB colour?

RGB stands for Red, Green, Blue. Each channel ranges from 0–255. Example: rgb(255, 87, 51). RGB is an additive colour model used for screens.

What is HSL colour?

HSL stands for Hue, Saturation, Lightness. Hue is 0–360°, Saturation and Lightness are 0–100%. HSL is more intuitive for creating colour variations.

Which format should I use in CSS?

All three work in CSS. HEX is most common, RGB is useful when you need transparency (rgba), and HSL is excellent for creating colour themes and tints programmatically.