Color Converter
Convert colors between HEX, RGB, and HSL. Pick from the color wheel, type values directly, and generate palettes. Copy any format with one click.
Color Converter
Convert between HEX, RGB, and HSL. Pick a color or type values.
Palette
How it works
HEX to RGB splits the 6-character hex string into three pairs and converts each from base-16 to a 0-255 integer. #FF0000 → R:255, G:0, B:0.
RGB to HSL normalizes RGB to 0-1, finds the min and max channels, then derives Hue (angle on the color wheel), Saturation (vividness), and Lightness (brightness).
The palette generator keeps your color's hue and saturation constant while varying lightness from 10% (dark) to 85% (light), giving you a coherent range.
FAQ
- What is the difference between HEX, RGB, and HSL?
- HEX is a 6-digit hexadecimal code (#3B82F6) used in CSS and design tools. RGB represents color as Red, Green, Blue values (0-255). HSL represents color as Hue (0-360°), Saturation (0-100%), and Lightness (0-100%). All three describe the same color in different formats.
- How do I convert HEX to RGB?
- Split the hex code into three pairs: #3B82F6 → 3B, 82, F6. Convert each pair from base-16 to base-10: 3B=59, 82=130, F6=246. So #3B82F6 = rgb(59, 130, 246). This tool does it instantly.
- What is HSL useful for?
- HSL is intuitive for creating color variations. To make a lighter version, increase L. To desaturate, decrease S. To shift the hue, change H. This makes HSL ideal for generating palettes and themes — much easier than tweaking RGB values.
- How does the palette generator work?
- It takes the hue and saturation of your selected color, then generates 6 variations at different lightness levels (10% to 85%). This gives you a range from dark to light while maintaining the same color character.
- Is this tool accurate?
- Yes. The conversions use standard mathematical formulas. HEX ↔ RGB is exact (just base conversion). RGB ↔ HSL uses the standard algorithm with rounding to integers. All computation happens in your browser.
Other tools you might like
- JSON FormatterPaste messy JSON, get clean formatted output — with validation and syntax highlighting.
- Regex TesterWrite, test, and debug regular expressions — with live match highlighting.
- Base64 Encoder/DecoderEncode and decode Base64 — text or files, instantly in your browser.
- Wealth ProjectionBuild wealth or draw it down. Watch compounding tip the scale — and see how long your corpus really lasts.
- Loan & EMI PlannerSee what your loan really costs — month by month, year by year — and how prepayments rewrite the math.
- Mortgage CalculatorMonthly payment, taxes, insurance, PMI — the full picture of what your home really costs.