Input Parameters

HEX

RGB

HSL

HEX Color

RGB Color

Red 52

Green 152

Blue 219

HSL Color

Hue 204째

Saturation 70%

Lightness 53%

Color Conversion Formulas

RGB to HEX: # + (R).toString(16) + (G).toString(16) + (B).toString(16)
HEX to RGB: parseInt(hex.substring(1,3), 16), etc.
RGB to HSL: Complex conversion involving max/min values and hue calculation
HSL to RGB: Complex conversion involving hue sectors and chroma
Note: All conversions maintain color fidelity

Conversion Results

Color Preview

#3498db

rgb(52, 152, 219)

RGB

rgba(52, 152, 219, 1)

RGBA

hsl(204, 70%, 53%)

HSL

hsla(204, 70%, 53%, 1)

HSLA

Color Information

Complementary Color

#db7434

Triadic Colors

#34dbbe, #be34db

Light Tint (10%)

#d1e5f5

Dark Shade (20%)

#1a4c6d

Contrast Ratio (White)

4.68:1

Color Converter: Convert Between HEX, RGB, HSL & More

Instantly convert color values between HEX, RGB, HSL, CMYK, and more using our versatile Color Converter. Perfect for web designers, developers, and graphic artists.

Wait, What’s a Color Converter Anyway?

Ever get stuck trying to figure out what #FF5733 actually means, or how to turn it into something your printer understands? Yeah, that’s where a color converter steps in. Basically, it’s your shortcut for flipping colors between all those geeky formats designers and printers love. Here’s the usual suspects:

HEX (Hexadecimal): Web nerds use this—think #FF5733. It’s that hashtag soup you see in CSS.
RGB (Red, Green, Blue): For anything with a screen. Like rgb(255, 87, 51). Fancy, huh?
HSL (Hue, Saturation, Lightness): Honestly, this one feels more “human.” It’s all about the vibe.
CMYK (Cyan, Magenta, Yellow, Black): Printers swear by this. If you’re sending stuff to print, you need it.

How Do You Actually Use This Thing?

Just slap in your color—HEX, RGB, HSL, CMYK, whatever. No need to overthink it.
Bam, the converter spits out the equivalents in all the other formats. Magic? Nah, just code.
Grab the one you need, paste it in your design, and move on with your life.

But Seriously, Why Bother?

Look, whether you’re cobbling together a website, tweaking a photo, or making sure your boss’s business cards don’t look like clown vomit, this thing saves you from manually translating colors or squinting at conversion charts. Trust me, nobody’s got time for that.

Here’s How It Plays Out:

Let’s say you plug in #00AEEF.
Here’s what you get back:

RGB: rgb(0, 174, 239)
HSL: hsl(195, 100%, 47%)
CMYK: cmyk(100, 27, 0, 6)

Pro Tip:

Test your color contrast, or keep your brand colors in line across apps. Or, you know, just flex on your coworkers.

Color Calculator

Color Converter