BrowserLeaksUSBrowserLeaksUS

Color Converter

Convert between HEX, RGB, HSL with live preview - fully client-side

Preview

hex#3B82F6
rgbrgb(59, 130, 246)
hslhsl(217, 91%, 60%)
rgbargba(59, 130, 246, 1)
tailwind#3b82f6
css--color: #3b82f6;

HEX

RGB

R
G
B

HSL

H
S
L

What this tool does

Converts color values between HEX, RGB, RGBA, HSL, HSLA, HSV, CMYK, and CSS named colors. Live color picker, eyedropper for real-time preview, WCAG contrast checker against black and white backgrounds.

Who it's for: Designers, front-end developers, and accessibility auditors verifying WCAG contrast ratios.

When to use

  • •Convert a design HEX to HSL for programmatic tweaks.
  • •Check if a button's color has sufficient contrast for WCAG AA.
  • •Match a CSS named color to its HEX equivalent.
  • •Generate RGBA variants with specific opacity.

How it works

  1. 1Enter a color in any format (HEX, rgb(), hsl(), name).
  2. 2All other formats display instantly.
  3. 3Contrast score against black/white is shown.
  4. 4Visual preview updates in real time.

Tips

  • •WCAG AA requires 4.5:1 contrast for normal text, 3:1 for large.
  • •HSL is easier for programmatic manipulation (shift hue, lightness).
  • •CSS named colors (140 total) are case-insensitive.