Skip to content
CrateX.app logo

CrateX.app

Color Converter

Convert one color locally between 6-digit HEX (#RRGGBB), RGB, HSL, and CMYK with a color picker, random color, live preview, channel controls, copy-ready HEX/RGB/HSL CSS values, and CMYK reference notation.

HEX

#

RGB

HSL

CMYK

Color Converter

Quick Start

1
Enter 6-digit HEX or RGB/HSL/CMYK channels
2
Use the picker or Random, then review synced values

Common Scenarios

Design handoff

convert HEX from design files to CSS RGB/HSL for development

Style guide

unify color formats and writing style across a component library

Print reference

convert screen color to CMYK as a first estimate, then confirm with proofing and the print workflow

Accessibility

use preview for a quick visual check only; use a dedicated contrast tool for exact ratios

Conversion Parameters & Display

Input rules: HEX supports only 6 digits (#RRGGBB, no #RGB, #RGBA, #RRGGBBAA, or alpha); RGB 0–255; H 0–360; S/L 0–100; CMYK 0–100. Input is case‑insensitive
Preview: desktop shows a live preview on the right; mobile runs a lightweight mode without preview
Color picker: use the color picker in the HEX card.
HEX uppercase policy: output is normalized to uppercase (e.g. #1E90FF); input is case‑insensitive; no case toggle
Fine‑tune: drag channel letters left/right (Shift×10, Alt÷0.1)
Copy output: the copy button outputs standardized HEX, RGB, and HSL CSS values (HEX uppercase), or CMYK reference notation as cmyk(...)

Usage Advice

Precision: device/display management varies; eyedropper values may differ slightly across apps
Alpha: current formats do not include alpha; use rgba()/hsla() or a separate alpha value
Color space: the web defaults to sRGB; verify carefully in P3/Display‑P3 workflows
Team consistency: agree on a canonical format in CSS (e.g. HSL)

Limitations & Compatibility

Device variance: different monitors/browsers/OS color‑manage differently; visuals may vary
CMYK is approximate: values depend on ICC profiles, paper, ink, devices, and proofing; use this as a reference, not a print-ready value
No alpha: this tool does not process transparency, rgba(), hsla(), #RGBA, or #RRGGBBAA values
CSS color subset: named colors, transparent, currentColor, HWB, HSV/HSB, Lab, LCH, OKLab, OKLCH, Display-P3, device-cmyk(), relative colors, color-mix(), and contrast-color() are outside this tool
No image or palette tools: this page does not do image sampling, screen eyedropper, palette generation, gradient generation, contrast ratio checks, CSS variable export, or design token export

Privacy & Security

Processing runs in your browser. The current color may remain in the current browser session. If you save a workspace or enable WebDAV, the current color may be saved or synced as part of that workspace. Derived outputs, undo history, and temporary errors are not stored or synced as separate data, and the tool does not keep a recent-colors list. This page does not read images, sample your screen, fetch URLs, or send colors for server-side conversion. On shared devices, clear the color and site data when needed.

FAQ

5

Continue with these related tools for the next step.

About

About Us
Pricing

Legal

Terms
Privacy Policy
Cookie Policy

Preferences

Manage Cookies

All tool processing happens locally in your browser.