Online color picker
Grab any shade you can imagine, then copy its HEX, RGB, HSL or RGBA value with one tap. Everything happens right here in the page — no accounts, no uploads, nothing leaves your device.
How the color picker works
Choose a hue
Slide the rainbow bar to land on the family you want — red, teal, violet — then fine-tune brightness and saturation by dragging inside the big square.
Dial it in
Type a known code straight into the Hex, RGB or HSL field and the picker jumps to it. Drop the opacity slider for translucent RGBA values.
Copy and paste
Hit copy next to whichever format your project needs. Paste it into CSS, a design file, or your codebase and keep moving.
Made for designers and developers
Every format, one place
Hex for CSS, RGB for canvas work, HSL when you want to nudge lightness, RGBA when you need transparency. Read them all at a glance and switch without a mental calculator.
Nothing to install
Skip the heavyweight design suite when you just need a quick swatch. The picker loads instantly, keeps working with the network off, and never asks you to register.
Private by design
Colors are computed locally with plain math in your browser. No image is uploaded, no value is logged, and there is no tracking tied to what you pick.
Understanding color codes
A color on screen is really three numbers: how much red, green and blue light to mix. The formats below are just different ways of writing that same recipe, and this picker keeps them all in sync so you can grab whichever one your tool expects.
Hex
The six-character code you see everywhere in web design, like #f59e0b. Each pair of characters is one channel — red, green, blue — written in base 16, from 00 (none) to ff (full). A leading eight-digit version adds an alpha pair for opacity.
RGB and RGBA
The same three channels written as plain 0–255 numbers, for example rgb(245, 158, 11). RGBA tacks on a fourth value from 0 to 1 for transparency, which is handy for overlays, shadows and glass effects.
HSL
A more human way to describe color: hue as an angle on the wheel (0–360°), then saturation and lightness as percentages. Because lightness is its own slider, HSL makes it easy to build a set of tints and shades from a single hue.
Questions people ask
Is the color picker really free?
Yes, completely. There is no paywall, no watermark on anything you copy, and no limit on how many colors you can pick. You never need an account.
Are my colors sent anywhere?
No. Every value is calculated by JavaScript inside your own browser tab. Nothing you pick is uploaded, saved on a server, or shared with anyone.
Can I paste in a code I already have?
Absolutely. Type or paste a hex, RGB or HSL value into its field and press Enter — the square and sliders snap to match so you can tweak from there.
What is the eyedropper button?
On browsers that support the native screen eyedropper (recent Chrome and Edge), a "Screen pick" button appears so you can sample any pixel on your display. If your browser lacks it, the button stays hidden.
How do I get a transparent color?
Drag the checkerboard opacity slider below the hue bar. Once opacity drops under 100%, the tool shows an RGBA value and an eight-digit hex you can paste directly into CSS.
Does it work on my phone?
Yes. The square and sliders respond to touch, so you can drag with a finger and copy codes on mobile just as easily as on a desktop.