How to Pick a Color and Copy HEX, RGB, or HSL
By Tools Star Hub Editorial Team · Published
Use the browser’s color control, or type a hex value, and copy the same color as HEX, RGB, or HSL.
The native control is enough when you need one opaque color for CSS. It does not sample a photograph, and it does not carry transparency.
How to pick a color
- Open the color control or type a hex value. The control is the browser’s native color input.
- Copy HEX, RGB, or HSL. They are three writings of that same opaque color.
- Reset when you want the default. Reset returns the picker to the default blue.
- Switch tools when the job is different. If you already have a hex string and need the channels, use Hex to RGB. If the color has to come from a photo, use the Image Color Analyzer. If the color will sit under text, check the pair in the Color Contrast Checker. This page does not compute a contrast ratio.
Example
#2563eb
#2563eb is rgb(37, 99, 235). The HSL line is hue, saturation, and lightness for that same color.
Things to watch
Opaque only
The native control supplies an opaque sRGB color. Alpha is not available. GIF frames and pixels from an uploaded photo are not sampled here.
FAQ
- Can I pick a transparent color?
- No. The browser color control on this page is opaque.
- Are HEX, RGB, and HSL different colors?
- No. They are three writings of the color you picked.
- How do I sample a photo?
- Use the Image Color Analyzer. This picker does not read pixels from an image.
- What does Reset do?
- It returns the control to the default blue.
To choose one opaque color and copy HEX, RGB, or HSL, use the Color Picker.