Docify

Color converter

Convert an opaque sRGB color between hex, rgb(), and hsl().

Docify's color converter maps opaque sRGB hex, rgb(), and hsl() in your browser. Hex is CSS Color Module Level 4 #RGB / #RRGGBB (3-digit form duplicates each nibble). HSL uses the Level 4 hslToRgb / rgbToHsl sample functions; 0–1 channels become bytes with Math.round(channel * 255). Convert is a button, not as-you-type. Not named colors, not Display P3, and not alpha. Nothing is uploaded.

Color
Converted sRGB

Swatch and values appear after Convert.

Hex
—
rgb()
—
hsl()
—

How it works

  1. Convert is a button, not as-you-type. Load sample fills #3366cc only. Copy writes the hex, rgb(), and hsl() lines. Nothing is uploaded.
  2. Hex is CSS Color Module Level 4: #RGB or #RRGGBB, optional #. Three digits expand by duplicating each nibble. Output hex is lowercase #RRGGBB.
  3. rgb() is legacy commas and integers 0–255. hsl() is legacy commas with a unitless hue (degrees; wrapped with ((h % 360) + 360) % 360) and percent saturation and lightness. HSL uses the Level 4 hslToRgb / rgbToHsl sample functions. Bytes are Math.round(channel * 255).
  4. This is not named colors, not rgba() / 8-digit hex, not modern space-separated functions, not Display P3, and not a contrast checker. The swatch sets background-color to the computed hex.

FAQ

Does this converter upload my color?
No. Convert and copy run in your browser. The page does not send the color string to a server.
Which color syntax is accepted?
Opaque sRGB only: #RGB or #RRGGBB (the # is optional; 3-digit form duplicates each nibble, so #36c is #3366cc), rgb(r, g, b) with integers 0–255, or hsl(h, s%, l%) with a unitless hue in degrees and percent saturation and lightness. Convert is a button, not as-you-type. 4-digit / 8-digit hex, rgba(), hsla(), slash-alpha, space-separated modern functions, percentages in rgb(), hue units (deg/rad/turn), named colors, and color() are rejected.
How are hex, RGB, and HSL converted?
Hex and rgb() are the same 8-bit sRGB triple. HSL uses the CSS Color Module Level 4 sample functions: hslToRgb (hue degrees 0–360, sat/light 0–100 → sRGB 0–1) and rgbToHsl (the reverse). 0–1 channels become bytes with Math.round(channel * 255). Hue wraps with ((h % 360) + 360) % 360. Achromatic colors (saturation about 0) serialize as hsl(0, 0%, L%) because the spec leaves hue undefined. Output hex is lowercase #RRGGBB.
Is this Display P3, Lab, or a contrast checker?
No. There is no ICC profile, no Display P3 / Rec.2020, no Lab / LCH / OKLCH / HWB, no relative color syntax, and no WCAG contrast or accessibility audit. The swatch is background-color set to the computed hex in the browser’s sRGB handling. Not a color picker, not an eyedropper, and not a palette generator.

Related