Converter

Color Format Converter

Translate colors between HEX, RGB, HSL, and CMYK with a live swatch — all in your browser like APK Analyzer and APK String Extractor: nothing is uploaded to DroidXP, and no extra color library is required. For picking from the screen, pair with Color Picker.

Ad placement — top banner
#RGB · #RRGGBB · #RRGGBBAA

CSS strings

Gradients & shadows: Gradient Generator, CSS Shadow Generator.

Ad placement — mid rectangle

What this tool does

You edit one representation — HEX, sRGB bytes, HSL, or print-style CMYK — and the rest stay synchronized. Read-only fields show ready-to-paste rgb(), hsl(), or cmyk() strings. Relative luminance follows the WCAG sRGB definition for quick lightness and contrast ballparking.

Local vs CDN

Conversions are plain JavaScript on your device: no color payload is sent to DroidXP. You only load this page’s normal static assets.

Privacy

The last RGBA tuple may be stored in localStorage so the swatch survives refresh. Clear site data if you share the machine.

How to use this tool

  1. Step 1: Use the swatch picker or edit HEX, RGB, HSL, or CMYK fields — values stay in sync.
  2. Step 2: Adjust alpha if you need transparent CSS or 8-digit HEX.
  3. Step 3: Copy rgb/hsl/rgba/hsla/HEX or CMYK readouts; note CMYK is a screen approximation for print planning.

Frequently Asked Questions

Does DroidXP upload my color values?

No. Every conversion runs in your browser with JavaScript math. RGB/HSL/HEX/CMYK numbers are not sent to DroidXP servers. No third-party color library is required.

Is CMYK accurate for professional print?

CMYK here is a standard sRGB-to-CMYK style transform for rough proofing. Real press workflows use ICC profiles, spot inks, and calibrated proofs — not a browser utility.

Why do HEX and RGB values “jump” slightly after editing HSL?

Values are rounded to integers (0–255) and finite precision in HSL↔RGB math. Tiny shifts after round-trips are normal.

What does the luminance number mean?

It is relative luminance in the sRGB sense (WCAG-style), useful for estimating perceived lightness and contrast pairs — not a substitute for a full contrast checker on your final design.

Do you support P3, LAB, or other wide-gamut spaces?

No. This tool works in sRGB. Displays and CSS may use wider gamuts; conversions beyond sRGB need specialized tools.

How does alpha work?

Alpha is 0–100% and maps to 8-bit transparency in HEX (#RRGGBBAA) and rgba()/hsla() CSS strings. The native color picker may not show alpha; use the alpha field when you need it.

Named CSS colors like “rebeccapurple”?

Not automatically. Use HEX or rgb/hsl inputs, or pick from the system color input, then copy the computed formats.

HSV / HSB instead of HSL?

This page uses HSL (hue, saturation, lightness). HSV is a different cylinder model; convert externally if your toolchain expects HSV.

Same privacy idea as APK Analyzer?

Yes: nothing is uploaded for the conversion step. Only normal page assets load like any static site.

Can I trust contrast against white or black text hints?

They are quick ratios from relative luminance. For accessibility sign-off, pair with a dedicated contrast checker and your real backgrounds.

Is this a design system token generator?

It helps inspect and copy formats. Token pipelines also need naming, themes, and build integration — beyond this page.

Ad placement — sidebar 300×600