Input
Preparing your workspace…
How to use
- Enter a HEX, RGB, HSL or CSS named color.
- Check the swatch and the converted values.
- Copy HEX, RGB or HSL using its own Copy button.
One color, three CSS formats
A design token may arrive as HEX while a stylesheet uses RGB or HSL. Converting its notation lets you reuse the color without choosing a new one.
The swatch and all three outputs update together. Named colors such as rebeccapurple can also be expanded into numeric CSS values.
Choosing a notation
HEX is compact for design tokens; RGB exposes red, green and blue channels; HSL separates hue, saturation and lightness. These are different descriptions of a color, rather than different image formats.
Short HEX notation is accepted alongside longer values. An alpha channel can be supplied with supported HEX, RGB or HSL syntax.
#2563ebrgb(37, 99, 235)The same opaque sRGB color expressed as HEX and RGB.
Transparency and precision
Transparent colors retain their alpha channel in the converted values. Their appearance still depends on the background behind them.
The converter works with sRGB values and rounds the displayed notation. It does not perform wide-gamut conversion for Lab, OKLCH or the CSS color() function.
Using a converted value
The copy buttons export a color value rather than a full property declaration. Use it with color, background-color, border-color or a design-token definition as appropriate.
Text input up to 1 MiB. CSS and HTML transformations run in a worker with a 30-second limit. Color tools use sRGB; generated styles are previews and require testing in your own layout.
Frequently asked questions
What color formats can I enter?
Use a supported HEX, RGB or HSL value, or a CSS named color. Unsupported syntax produces an error instead of a converted value.
Will transparency be preserved?
Yes. Supported alpha input is included in the converted formats. Check the swatch against the background where the color will be used.
Why does the output use different spelling or precision?
Values are normalized and rounded for display. The tool does not preserve the original shorthand, whitespace or exact numeric spelling.
Does this support OKLCH or Display P3?
No. This workspace is limited to sRGB color representations; it does not map wider color gamuts into sRGB.
Are my color values uploaded?
No. Conversion and the preview run in your browser. Copy writes only the selected output to your clipboard.