🎨

HEX / RGB / HSL Color Converter

Live preview, complementary color, CSS ready
Anteprima
Colore complementare
CSS output

    

                    


                    

                        
Color formats on the web

        
Web colors are expressed in three main formats: HEX (e.g. #ff5733), RGB (e.g. rgb(255, 87, 51)) and HSL (e.g. hsl(11, 100%, 60%)). All three represent the same color in the sRGB space. HEX is the most compact, RGB is intuitive for those who think in red-green-blue, HSL is easiest to manipulate (changing hue only changes the tint, keeping saturation and lightness).

        
Which format to use

        
    
            
  • HEX: compact, de facto standard, ideal for CSS
    • 
            
  • RGB/RGBA: needed for transparency with 0-255 values
    • 
            
  • HSL/HSLA: best for generating palettes (vary only the hue)
    • 
        

        
Complementary color

        
The complementary color is opposite on the color wheel (hue + 180°). It's useful to create strong contrasts and pleasing visual pairings. The tool computes it automatically.

                    


                    

                        
Frequently asked questions

                        
Can I enter 3-digit HEX?
Yes, the tool accepts both #fff and #ffffff. 3-digit forms are expanded automatically (#fff = #ffffff).