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.
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.
Preview
Results
#2563EB#2563EBFFrgb(37, 99, 235)rgba(37, 99, 235, 1)hsl(221, 83%, 53%)hsla(221, 83%, 53%, 1)hsv(221, 84%, 92%)hwb(221 15% 8%)cmyk(84%, 58%, 0%, 8%)2455019--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
Wheel controls
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?
#00395FCompact and common in web design. HEXA adds transparency with an extra alpha channel.
rgb(0, 57, 95)Useful in CSS. HSL is often easier when adjusting hue, saturation or lightness manually.
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.
