Color Palette
Pick colors online or enter HEX, RGB, or HSL to instantly sync and convert every color code format.
Tip: you can paste #RGB / #RRGGBB, rgb(...), or hsl(...) values.
Online Color Picker
Drag the picker or RGB sliders to sync color codes instantly- Pick a color with the color picker or fine-tune using RGB sliders.
- Or paste a HEX, RGB, or HSL value directly into any input.
- When one format changes, all other formats update in real time.
- Click copy buttons to copy HEX, RGB, or HSL values.
Tip:Supports #RGB, #RRGGBB, rgb(...), and hsl(...) formats. Use "Random Color" for inspiration.
When would you use this?
- When you need to move quickly between HEX, RGB, and HSL during design handoff, frontend work, or brand color cleanup.
- When you want to tweak a color but are not sure which numeric format is easiest for the adjustment.
- When you need to copy a color code directly into CSS, design tools, presentations, or documents.
What is the difference between HEX, RGB, and HSL?
HEX is common in design handoff and frontend code, RGB shows direct red-green-blue channel values, and HSL is often easier when thinking in hue, saturation, and lightness. They are different representations of the same color.
Which format should I use to adjust a color?
HEX is handy when you want to paste directly into code, RGB is intuitive when adjusting channel values, and HSL is often easier for building lighter, darker, or shifted color variations. In practice, many people switch between them.
Why do I see an invalid format message while I am still typing?
Because the tool validates whether the current input already forms a complete parsable color value. If the value is only incomplete for the moment, it usually resolves as soon as you finish typing.
What is the random color button useful for?
It is useful for inspiration, quick experimentation, and breaking out of the same familiar color range. Once you find something close, you can fine-tune it with the other controls.
Can this tool evaluate color contrast or accessibility?
This page focuses on color picking and format conversion, not contrast evaluation. If you want to check readability between text and background, use the site contrast checker alongside it.
Social Media Image Editing Workflow: Sizes, Visual Consistency, and Export Settings
Great social visuals come from process, not luck. Learn a repeatable image editing workflow that covers dimensions, composition, brand consistency, and output settings for high-performing posts.
The Complete Color Code Guide: RGB, HEX & HSL Explained
RGB, HEX, and HSL all describe the same colors — but in completely different ways. This guide breaks down the math, the design logic, and when to use each color model, from screen design to print and accessibility.