HEX to RGB color converter

How to convert HEX to RGB

Type a HEX value such as #3b82f6 or pick a color with the picker. The color shows as HEX, RGB, HSL and OKLCH at once, each ready to copy. #3b82f6 becomes rgb(59, 130, 246). A large swatch previews the exact shade, transparency included if you use 8-digit HEX with an alpha channel. 3-digit shorthand such as #fff works too.

Why OKLCH matters

OKLCH is a color space built to match how people see lightness and color strength. All major browsers support it. Changes to lightness and chroma look even to the eye, which is why more design systems define palettes in OKLCH. This converter computes it from sRGB.

Ready to paste into CSS

Every format is valid CSS: rgb(), hsl() and oklch(). Paste it straight into a stylesheet. Alpha is added when your color isn't fully opaque.

When to use each format

HEX is the most common format in design tools and brand guides. rgb() is useful when you need to adjust channels in code. hsl() makes it easy to build lighter or darker variants of one hue. oklch() keeps perceived lightness even across hues, which helps when you build accessible palettes with predictable contrast.

Before you start

HEX to RGB Converter works on the text or values you enter. Output: Color formats. The settings appear before anything runs, so you can check them first. Your original file is never changed.

The value you enter is processed in your browser. Still test the output where it will be used. Clean formatting does not prove the data is safe or correct.

Keep the original until you have opened and checked the result. The work happens in this browser tab, so the size you can handle depends on your device's memory, your browser and the file itself.

How to use the HEX to RGB color converter

1. Pick a color with the picker or type a HEX code.
2. See it as RGB, HSL and OKLCH.
3. Check the preview swatch for the exact shade.
4. Copy the CSS format you need.