Tools

Color Converter

Convert colors between HEX, RGB, HSL, and OKLCH formats instantly.
Detected: HEX

HEX

#3b82f6

RGB

rgb(59, 130, 246)

HSL

hsl(217.2, 91.2%, 59.8%)

OKLCH

oklch(0.6231 0.188 259.81)

Color Format Reference

HEX: Standard web color notation — #rrggbb or shorthand #rgb.

RGB: Red, Green, Blue channel values from 0 to 255 — rgb(r, g, b).

HSL: Hue (0–360°), Saturation (0–100%), Lightness (0–100%) — hsl(h, s%, l%).

OKLCH: Perceptual lightness, chroma, and hue — oklch(L C H). Used by Tailwind CSS v4.

When to use the color converter

Use this tool when design files, inspiration boards, and existing code all describe the same color in different formats. Nuxt UI work often involves HEX values from brand guidelines, RGB or HSL values from browser tooling, and OKLCH values from Tailwind CSS v4, so converting precisely helps you keep one source of truth.

It is especially useful when you are migrating an older theme or matching a palette supplied by a designer. Convert the final value, confirm the numeric channels look correct, and then move that result into your theme config or contrast checks without retyping it by hand.

Related guides