Color Converter

Color Converter

Convert colors between HEX, RGB, and HSL. Type or paste below — all three formats update as you type.

Free
No signup
Instant
Private
Input
0 words • 0 characters • 0 without spaces • 0 lines
Output
0 words • 0 characters • 0 without spaces • 0 lines

Private by design

This conversion runs entirely in your browser. Your text is not sent to a server.

Tip

Accepts #RGB, #RRGGBB, rgb()/rgba(), compact r,g,b triples, and hsl()/hsla(). Alpha is ignored.

How to convert with Color Converter

  1. Paste a HEX, RGB, or HSL color.

  2. HEX, RGB, and HSL appear together as you type — nothing is uploaded.

  3. Copy the formats you need, or use the result as the next input.

  4. Open Color Picker or Gradient Generator for visual tools.

When should you use it?

  • CSS

    Paste a hex from a mockup and copy rgb() or hsl() for a stylesheet.

  • Design

    Match a brand color across HEX, RGB, and HSL without a picker.

  • Round-trip

    Any supported input yields all three formats at once.

  • Stays here

    Conversion runs in this tab. Nothing is uploaded.

Your colors stay private.

Color conversion runs entirely in your browser. Values never leave this tab.

Learn more about privacy →

About converting HEX, RGB, and HSL in the browser

Color Converter accepts #RGB, #RRGGBB, rgb()/rgba(), compact r,g,b triples, and hsl()/hsla(), then shows HEX, RGB, and HSL together as you type. Alpha is ignored. This is a value converter, not Color Picker (visual chip) and not Gradient Generator (CSS linear-gradient).

Worked example: #FF5733 becomes rgb(255, 87, 51) and an HSL triple with hue near 14°. Round-trip HEX → RGB → HEX should match typical six-digit colors.

Limitations: named CSS colors (rebeccapurple) are out of scope; wide-gamut and OKLCH are not modeled. Related: Color Picker, Gradient Generator, CSS Border Generator. Nothing is uploaded.

Related color tools

Color Converter examples

HEX

Input
#FF0000
Output
HEX: #FF0000 RGB: rgb(255, 0, 0) HSL: hsl(0, 100%, 50%)

RGB

Input
rgb(255, 87, 51)
Output
HEX: #FF5733 RGB: rgb(255, 87, 51) HSL: hsl(11, 100%, 60%)

HSL

Input
hsl(0, 100%, 50%)
Output
HEX: #FF0000 RGB: rgb(255, 0, 0) HSL: hsl(0, 100%, 50%)

Format comparison

FormatExampleTypical use
HEX#FF5733CSS, design tokens, and hex dumps
RGBrgb(255, 87, 51)Canvas, CSS, and component props
HSLhsl(11, 100%, 60%)Tune hue, saturation, and lightness in CSS

Color Converter FAQ

HEX (#RGB or #RRGGBB), RGB/RGBA strings, compact RGB triples, and HSL/HSLA strings. HEX, RGB, and HSL update as you type.

No. Paste any supported color and Toolora returns HEX, RGB, and HSL together. Nothing is uploaded.