Zellio.io

Color Converter

Convert HEX, RGB and HSL and check WCAG contrast in real time.

Processed locally — nothing is uploaded

About Color Converter

The contrast readout is the useful half, scoring a foreground and background pair against WCAG thresholds while you adjust them. You find out a combination fails at the point you can still change it, rather than in an audit months later.

Convert colours between HEX, RGB and HSL in both directions and check WCAG contrast ratios for accessibility as you work. Designers and developers use it to translate brand colours across formats and to confirm text is readable against its background.

Pair a foreground and background colour to see whether the combination clears AA or AAA. The thresholds differ by size — large text passes at 3:1 where body text needs 4.5:1 — which is why a heading can survive a tint its own paragraph cannot.

Learn how this works

A Practical Guide to Everyday Developer Encoding & FormattingHow and when to use Base64, JSON formatting, hashing, JWTs, regex and cron — with free in-browser tools for each task.11 min read

Frequently asked questions

What is a WCAG contrast ratio?

It measures the luminance difference between text and its background. WCAG recommends at least 4.5:1 for normal text (AA) so content stays readable for everyone. A ratio of 7:1 (AAA) is preferred for maximum accessibility, especially for users with low vision or color blindness. The contrast ratio is calculated from the relative luminance values of the foreground and background colors, with higher ratios indicating better readability. Testing your color combinations against WCAG guidelines ensures your website complies with accessibility standards and remains usable for users with various vision abilities.

Which colour formats are supported?

HEX, RGB and HSL, converted both ways in real time, plus a live contrast check between two colours. HEX (hexadecimal) format like #FF5733 is compact and widely supported in web design; RGB (0-255 per channel) is intuitive and commonly used in code; HSL (hue, saturation, lightness) is the most human-friendly for understanding color relationships. The converter instantly translates between all three formats as you edit, so you can work in whichever format suits your workflow. The live contrast ratio checker helps you verify accessibility compliance by testing any two colors together before implementing them in your design.

Is it free?

Completely. There is no sign-up, no account, no watermark and no usage limit. The tool is supported by unobtrusive ads, not by selling or processing your data.

More Color Converter tools

HEX ⇄ RGB ⇄ HSL Color Converter

Related tools

Base64 Encode / DecodeConvert text or files to and from Base64 instantly in your browser.Code FormatterBeautify, minify and validate JSON, HTML, CSS, SQL, XML and YAML.Regex Tester & BuilderTest patterns against text and build common regex from presets.Slug / URL EncoderClean broken URLs or turn any title into a safe URL slug.