CSS & Frontend

Color Converter

Convert six-digit HEX colors into equivalent RGB and HSL values with a live swatch.

Color values
Your result will appear here.
Processed locally in this browser. Your input is not sent to DevKitly.

What is Color Converter?

Enter a hex color such as #087f72 or #fff. The converter outputs the equivalent rgb() and hsl() values ready to paste into CSS.

How to use Color Converter

  1. Paste your input into the editor above, or select Sample to load an example.
  2. Select Convert color. If the input cannot be processed, a message explains what to fix.
  3. Use Copy or Download to take the result with you, and Clear to start again.

Example

Input

#087f72

Output

HEX: #087F72
RGB: rgb(8, 127, 114)
HSL: hsl(173, 88%, 26%)

Practical use cases

  • Translate design tokens
  • Debug CSS colors
  • Prepare values for different tools

Common problems

  • Omitting digits from shorthand values
  • Confusing RGB channels with percentages
  • Expecting conversions to change color gamut

Frequently asked questions

Is Color Converter free to use?

Yes. Color Converter is free and does not require an account.

Does my input leave the browser?

No. This tool performs its processing locally in your browser and does not need to upload your input.