Developer Tools
Color Converter
Convert colors between HEX, RGB, and HSL formats with live preview.
How to use
Enter a HEX color code (with or without #) and click "Run Tool" to see all color format conversions. The preview box updates as you type.
Example input
#6366f1
Example output
HEX: #6366F1 RGB: rgb(99, 102, 241) HSL: hsl(239, 84%, 67%) RGBA: rgba(99, 102, 241, 1) CSS Variable: --color-custom: #6366f1;
FAQ
What color formats are supported?
Currently, input must be in HEX format (3 or 6 characters). The tool outputs HEX, RGB, RGBA, and HSL formats.
Can I use shorthand HEX codes?
Yes! Both 3-character (e.g., #f00) and 6-character (e.g., #ff0000) HEX codes are supported.
What is HSL?
HSL stands for Hue, Saturation, Lightness. It's often more intuitive for designers as it separates color, saturation, and brightness.