Color Converter

Convert colors between HEX, RGB, and HSL formats using an interactive color picker or by typing any known value. One-click copy for any format. See the exact color preview as you type. Indispensable for CSS styling, UI design, and branding work.

Updated June 2026

  1. 1Enter a color value
  2. 2View all formats
  3. 3Copy the format you need

#34A6FD

Click to pick a color

HEX

#34A6FD

RGB

rgb(52, 166, 253)

HSL

hsl(206, 98%, 60%)

How to use Color Converter

  1. 1

    Enter a color value

    Type or paste a HEX, RGB, HSL, or named CSS color.

  2. 2

    View all formats

    The tool instantly converts it to every other format, plus a live color swatch.

  3. 3

    Copy the format you need

    Grab the exact syntax for your CSS, design tool, or code.

Frequently asked questions

Everything you need to know about color converter.

HEX (e.g., #34a6fd), RGB (e.g., rgb(52, 166, 253)), and HSL (e.g., hsl(207, 98%, 60%)). These cover the formats used in CSS, Figma, Sketch, and all major design tools.

Explore more free Developer Tools

ToolBubble (Tool Bubble) has 14 free developer tools that work in your browser, with no signup required.

All Developer Tools
We read every message

Need help with Color Converter?

Report an issue or suggest an improvement. Messages go straight to the people who build ToolBubble.