env.dev

Color Converter

Convert colors between HEX, RGB, HSL, HSV, and OKLCH online. Live preview, named CSS colors, WCAG contrast check, and instant copy in any format — no signup.

Last updated:

Color value
HEX
#3B82F6
RGB
rgb(59, 130, 246)
HSL
hsl(217, 91%, 60%)
HSV
hsv(217, 76%, 96%)
OKLCH
oklch(62.3% 0.188 259.8)
WCAG contrast
On white3.68:1
Sample text
Normal: FailLarge: AA
On black5.71:1
Sample text
Normal: AALarge: AAA
Named CSS colors

How to Use Color Converter

  1. 1Enter a color in any CSS format — HEX, rgb(), hsl(), or a named color like rebeccapurple — or pick one with the swatch.
  2. 2See it converted to HEX, RGB, HSL, HSV, and OKLCH, each with a copy button.
  3. 3Check the WCAG contrast panel for the ratio against white and black, with AA/AAA pass marks.
  4. 4Click any named-color swatch to load it instantly.

Frequently Asked Questions

What is the difference between HEX, RGB, and HSL?

HEX uses a six-character hexadecimal string (#RRGGBB) and is the most common format in CSS. RGB specifies red, green, and blue channels as numbers 0-255. HSL describes colors by hue (0-360°), saturation (0-100%), and lightness (0-100%), making it more intuitive for adjusting brightness and vibrancy.

What is OKLCH and why use it?

OKLCH (lightness, chroma, hue in the OKLab perceptual space) is a CSS Color 4 format supported in all major browsers since 2023. Because it is perceptually uniform, changing only lightness keeps the hue stable — so it produces smoother gradients and more even palettes than HSL, and can express colors outside the sRGB gamut.

How is the WCAG contrast ratio calculated?

It uses the WCAG 2 formula (L1 + 0.05) / (L2 + 0.05) on the relative luminance of the two colors. WCAG AA needs 4.5:1 for normal text and 3:1 for large text (≥24px, or ≥18.66px bold); AAA needs 7:1 and 4.5:1. The panel shows the ratio against white and black with the pass level for each.

Is my data sent to a server?

No. All color conversions are performed entirely in your browser. No data is sent to any server.

Related Tools

Unix Timestamp Converter

Convert Unix timestamps to human-readable dates and back. Handles seconds, milliseconds, UTC, local time zones, ISO 8601, and relative times — fast and offline.

Number Base Converter

Convert numbers between decimal, hexadecimal, octal, and binary instantly in your browser. Handy for debugging bitmasks, color hex codes, and chmod permissions.

Text Case Converter

Convert text between camelCase, PascalCase, snake_case, kebab-case, UPPER, lower, Title and Sentence case.

YAML ↔ JSON Converter

Convert YAML to JSON and JSON to YAML in your browser. Bidirectional conversion preserves nested structure and types — for Kubernetes manifests and CI configs.