Color Conversion

ElektroBox Tool

Color Converter for HEX, RGB, HSL, HSV, CMYK and CSS Colors

Convert colors directly in your browser for websites, electronics dashboards, UI mockups, LED projects and documentation. Check HEX, RGB, HSL, HSV, HWB, CMYK, decimal values and contrast ratios in one clean workspace.

Live preview Browser-side conversion Useful for web and maker projects

Color tool

Color converter

Convert, preview and copy color values for web, documentation and maker projects.

Color conversion

Convert colors between HEX, RGB, HSL, HSV, HWB, CMYK and common CSS formats.

Auto detects common color formats.
Supported: HEX, HEXA, RGB(A), HSL(A), HSV/HSB, HWB, CMYK, decimal and browser-supported CSS color names.
100%
Quick colors
Ready.

Preview

Selected color
#2563EB
The checkerboard background shows transparency when alpha is below 100%.
Contrast on white
Contrast on black

Results

HEX#2563EB
HEXA#2563EBFF
RGBrgb(37, 99, 235)
RGBArgba(37, 99, 235, 1)
HSLhsl(221, 83%, 53%)
HSLAhsla(221, 83%, 53%, 1)
HSV / HSBhsv(221, 84%, 92%)
HWBhwb(221 15% 8%)
CMYKcmyk(84%, 58%, 0%, 8%)
Decimal2455019
CSS variable--color: #2563EB;

Continuous color wheel

Pick a color from a continuous HSV color wheel. Drag inside the wheel to change hue and saturation.

Wheel picker

Use mouse, touch or pen input. The wheel updates the conversion results instantly.

Wheel controls

92%
100%
Current wheel selection
H 221° · S 84% · V 92%

Formats & notes

Input format: use Auto detect or select a specific input syntax such as HEX, RGB, HSL, HSV, HWB, CMYK, Decimal or CSS name/value. When a format is selected, the input field is formatted in that syntax.

HEX / HEXA: common web color notation. HEXA adds an alpha channel at the end, for example #2563EBCC.

RGB / HSL / HSV / HWB: useful for CSS, design systems and color tuning. HSV is used by the continuous color wheel.

CMYK: calculated as a simple digital conversion. Print production can require calibrated ICC profiles, so CMYK values here should be treated as a practical estimate.

Privacy: all conversion happens in the visitor’s browser. The plugin does not send color inputs to your server.

How to use it

Convert colors and copy the format you need

Enter a color value or select one with the native picker. The converter updates all common output formats immediately, including HEXA with alpha, CSS RGB/RGBA, HSL/HSLA, HSV/HSB, HWB, CMYK, decimal and a ready-to-copy CSS variable.

Enter or paste

Use auto-detection for common values such as #00395F, rgb(0 57 95) or hsl(204 100% 19%).

Preview and compare

The preview panel shows the selected color and gives a quick contrast ratio on white and black backgrounds.

Copy the output

Use the copy buttons to transfer the exact value into CSS, WordPress blocks, documentation or embedded display code.

Format guide

Which color format should you use?

HEX / HEXA #00395F

Compact and common in web design. HEXA adds transparency with an extra alpha channel.

RGB / HSL rgb(0, 57, 95)

Useful in CSS. HSL is often easier when adjusting hue, saturation or lightness manually.

HSV / CMYK hsv(204, 100%, 37%)

HSV is practical for color pickers and LEDs. CMYK is a digital estimate for print workflows.

FAQ

Color converter questions

Are colors sent to the server?

No. The conversion runs in the visitor’s browser and does not need to upload color values to WordPress.

Why can CMYK values differ from print software?

This tool calculates a simple digital CMYK approximation. Professional print output can vary because it depends on ICC profiles, ink, paper and printer calibration.

What does the alpha slider do?

Alpha controls transparency. A value of 100% is fully opaque; lower values are exported in formats such as RGBA or HEXA.