Usage Examples

#3498db

Blue accent — common primary button color

HEX: #3498db | RGB: 52,152,219

#e74c3c

Red — error states and destructive actions

HEX: #e74c3c | RGB: 231,76,60

#2ecc71

Emerald green — success states and confirmations

HEX: #2ecc71 | RGB: 46,204,113

#f39c12

Orange — warning alerts and highlights

HEX: #f39c12 | RGB: 243,156,18

#000000

Pure black — text color and high contrast

HEX: #000000 | RGB: 0,0,0

HSL

Purple — creative sections and gradients

HSL: 280°, 70%, 60%

How to Use Color Converter

1

Enter a Color

Type a color value or use the color picker. Supported: HEX (#RRGGBB), RGB, HSL, CMYK.

2

Select the Input Format

Click the tab that matches your input color format.

3

View All Formats

See the color converted to HEX, RGB, HSL, CMYK, RGBA, and an approximate color name.

Frequently Asked Questions

Color Formats

What is HEX color format?

HEX is a six-digit representation using 0-9 and A-F, where the first two digits represent red, the middle two green, and the last two blue (e.g., #3498db). It's the most common format in CSS and web development.

What is the difference between RGB and HSL?

RGB defines colors by mixing Red, Green, and Blue light (each 0-255). HSL defines colors by Hue (color type 0-360°), Saturation (intensity 0-100%), and Lightness (brightness 0-100%), which is more intuitive for humans to adjust.

What is CMYK used for?

CMYK (Cyan, Magenta, Yellow, Key/Black) is used for printing. It describes how much of each ink color is needed to reproduce a color on paper. CMYK is essential for print design, business cards, and brochures.

What is RGBA?

RGBA is RGB with an Alpha (transparency) channel. The alpha value ranges from 0 (fully transparent) to 1 (fully opaque). Example: rgba(52, 152, 219, 0.5) is 50% transparent blue.

Practical Use

How do I convert HEX to RGB?

Split the HEX code into pairs: RRGGBB. Convert each pair from hex to decimal. For #3498db: 34₁₆=52, 98₁₆=152, db₁₆=219. So RGB is (52, 152, 219).

How do I adjust a color's brightness?

Use HSL format and change the Lightness value. Increase it for a lighter color, decrease for darker. For example, hsl(204, 70%, 70%) is a lighter version of hsl(204, 70%, 53%).

Why do colors look different on different screens?

Each display has its own color gamut and calibration. sRGB is the standard web color space, but some displays support wider gamuts (DCI-P3, Adobe RGB). Colors may appear more saturated on wider gamut displays.