Color Picker

Pick and work with colours without the fuss

We built Color Picker in 2025 because we were tired of heavyweight apps and complicated colour pickers. As front‑end developers and illustrators ourselves, we needed something that let us grab a colour, tweak it and move on. What started as an internal tool quickly became popular with colleagues, so we tidied it up and put it on the web for anyone to use. No accounts, no learning curve – just load the page, choose a shade and copy the HEX, RGB, HSL or HSV codes.

Why do people like our color picker?

If you’ve ever stared at a design and wondered how to capture just the right hue, you’ll appreciate how simple Color Picker feels. We kept the interface minimal on purpose:

• You click, you get your color – tap anywhere on the palette and the tool spits out the exact values you need. Want to sample a photo, screenshot or piece of artwork? Drag it into the page and use the eyedropper to grab a pixel.
• Gradients made easy – you can build silky smooth transitions by adding and moving stops on a bar. Switch between linear and radial gradients, adjust angles and transparency, then copy the CSS when you’re happy.
• No limits, no cost – Color Picker runs in any modern browser on desktop, tablet or phone. There’s nothing to install and no charge to use it.
• Extensions when you need them – our optional Chrome and Edge add‑ons bring the eyedropper right into your browser, so you can sample colours from any page and keep your history with you.

What it’s good for

Different people use Color Picker in different ways:

• Designers and product teams reach for it when they’re sketching out interfaces or brand palettes. It’s quick to explore combinations and grab the CSS you need for gradients.
• Illustrators and artists use the eyedropper to pull inspiration from photos and paintings. The gradient tool helps plan smooth shading and colour transitions.
• Front‑end developers lean on it to generate consistent colour values across projects. The extension makes sampling colours from existing sites effortless.
• Anyone checking accessibility can view colours in different models and tweak opacity until they meet contrast guidelines.

Getting started

You don’t need a manual to use our picker, but here’s a quick rundown:

• Choose your colour – click anywhere on the palette. You’ll immediately see the HEX, RGB, and HSV values. Use the sliders to nudge hue, saturation, brightness, and transparency.
• Sample from an image – drop an image file onto the page or select one. Click the pixel you want, and the colour codes appear.
• Build a gradient – click on the gradient bar to add stops and drag them around; toggle between linear and radial styles. Fine‑tune the angle and opacity until you like the result.
• Copy and reuse – your colours and gradients are automatically saved. Copy the codes or CSS and paste them into your project or share them with your team.