Color Converter: HEX, RGB and HSL
Type a color in any format – #a78bfa, rgb(167 139 250) or hsl(255 92% 76%) – and every other format updates instantly. Pick colors visually, set the opacity and check the WCAG contrast ratio for text.
- Free
- No upload
- No sign-up
CSV to JSON and JSON to CSV
Quoted fields, line breaks inside cells, semicolon CSV from Excel and JSON Lines are handled.
Base64 encoder and decoder
UTF-8 safe for accents and emoji. Decoding ignores line breaks and missing padding.
Color converter: HEX, RGB and HSL
Type or paste a color in any field, or use the picker. All formats update together.
WCAG contrast
AA needs 4.5:1 for normal text and 3:1 for large text (24px, or 19px bold). AAA needs 7:1 and 4.5:1.
Number base converter
Binary, octal, decimal and hexadecimal. Very large and negative whole numbers are supported.
Spaces and underscores are ignored, and the prefixes 0b, 0o and 0x are accepted. Negative numbers keep a minus sign; for values that fit in 8 to 128 bits the two’s complement form is shown too.
Text case converter
Accented letters such as á, ž and ľ are kept, and ß becomes ẞ in capitals. Code cases are applied line by line.
URL encoder and decoder
Percent-encode text for links and query strings, or decode %20-style text back.
Component encodes every reserved character (/ ? & = #), for a single query value or path part. Full URL keeps the URL structure readable.
Unix timestamp converter
Seconds or milliseconds are detected automatically from the number of digits.
Current Unix time: —
Without Z or an offset such as +02:00, the date is read in your time zone (local).
- Unix time (seconds)
—- Unix time (milliseconds)
—- ISO 8601, UTC
—- ISO 8601, your time zone
—- Readable, your time zone
—- Relative
—
Runs entirely in your browser. Your data, files and text are never uploaded.
HEX, RGB and HSL explained
HEX and RGB describe a color by its red, green and blue light, from 0 to 255 each; HEX simply writes those three numbers in base 16, so #ff8800 is rgb(255, 136, 0). Short forms like #f80 and eight-digit forms with an alpha channel such as #ff880080 are accepted.
HSL describes the same color as hue (an angle on the color wheel), saturation and lightness, which makes it easy to create lighter or darker shades of a brand color by changing one number. Both the classic comma syntax and the modern space and slash syntax from CSS Color 4 are understood.
The contrast panel shows the WCAG 2 contrast ratio of the color as text on white and on black. Body text needs at least 4.5:1 for level AA and 7:1 for AAA; large text needs 3:1 and 4.5:1. Transparent colors are blended onto the background first, exactly as a browser would show them.
How to use the Color Converter: HEX, RGB and HSL
- Type or paste a color into the HEX, RGB or HSL field, or open the color picker.
- Adjust the opacity slider if you need a transparent color; RGBA, HSLA and 8-digit HEX follow.
- Check the contrast ratio and the AA and AAA badges for text on white and black.
- Copy the format you need straight into your CSS, design tool or code.
Frequently asked questions
How do I convert HEX to RGB?
Paste the HEX code, with or without the #, into the HEX field. The RGB and HSL fields show the same color immediately, ready to copy.
What does the 8-digit HEX code mean?
The last two digits are the alpha channel: ff is fully opaque and 00 fully transparent. #a78bfa80 is the same violet at about 50% opacity.
Which contrast ratio do I need for accessible text?
WCAG level AA asks for 4.5:1 for normal text and 3:1 for large text (24 px, or 19 px bold). Level AAA asks for 7:1 and 4.5:1.
Can I paste colors written in modern CSS syntax?
Yes. Both rgb(167, 139, 250) and rgb(167 139 250 / 50%) work, and the same goes for hsl() and hsla(). The # in front of a HEX code is optional.
More conversions
Code & data converters
Other categories