Instantly convert HEX to CMYK and CMYK to HEX.
Translate hexadecimal color codes to CMYK values. This page follows the same polished product structure as the CSS converter tools while adapting the live experience to real color previews, format channels, and production-ready output.
Base color
Use the shared live preview as the anchor point for both color formats.
Live preview
Shared source for every active conversion field on this page.
Conversion
Edit either side, copy any result, or swap the displayed direction.
HEX
CMYK
#7C3AED
cmyk(47.7%, 75.5%, 0%, 7.1%)
Canonical page shared by this workflow: HEX to CMYK. The reverse direction is still available in the same interface via the swap control.
Current color spectrum
A responsive tonal strip generated from the active color preview.
#E5D8FB
#C4A6F7
#7C3AED
#5D2CB2
#3E1D77
Current conversion
#7C3AED
cmyk(47.7%, 75.5%, 0%, 7.1%)
Live swatch
#7C3AED
rgb(124, 58, 237)
Fast handoff formats
#7C3AED
rgb(124, 58, 237)
hsl(262.1, 83.3%, 57.8%)
Why this matters
Translate one live color between engineering, design, print, and video-friendly models without losing track of its visual appearance.
Step 1: Define the source format precisely
Enter the source color using the channels of HEX. The tool keeps the live preview synchronized so you can validate the color visually while editing the numeric or textual values.
Step 2: Normalize the color through the internal RGB preview
Every supported format is normalized into a single live screen preview. That shared representation keeps the conversion stable while preserving the same visual color across both sides of the interface.
Step 3: Read the target format and copy the output
Once the live preview is resolved, the target format updates immediately. Copy the generated value directly into your design tool, frontend codebase, or production handoff documentation.
| Preview | HEX | CMYK |
|---|---|---|
#0F172A | #0F172A | cmyk(64.3%, 45.2%, 0%, 83.5%) |
#2563EB | #2563EB | cmyk(84.3%, 57.9%, 0%, 7.8%) |
#7C3AED | #7C3AED | cmyk(47.7%, 75.5%, 0%, 7.1%) |
#10B981 | #10B981 | cmyk(91.4%, 0%, 30.3%, 27.5%) |
#F59E0B | #F59E0B | cmyk(0%, 35.5%, 95.5%, 3.9%) |
#EF4444 | #EF4444 | cmyk(0%, 71.5%, 71.5%, 6.3%) |
Understanding HEX
HEX is the most familiar format for interface work. It is concise, CSS-friendly, and ideal for design tokens, UI variables, and quick handoff workflows.
Understanding CMYK
CMYK is the subtractive print color model used across packaging, editorial, and production handoff workflows where inks matter more than emitted light.
Why convert HEX and CMYK?
- Design consistency: Keep one visual color aligned across UI mockups, code, and production deliverables.
- Workflow translation: Move between web-native, print-oriented, and color-science formats without manually rebuilding the color each time.
- Cleaner handoff: Give design, brand, and engineering teams the exact representation they need for the same color decision.