👉 Chrome Web Store:
https://chromewebstore.google.com/detail/snap-color-picker/mjeedkpeoafpaalcgmfepblpohmnkddh
If you are a frontend developer or designer, you've probably done this before:
- Open DevTools
- Inspect an element
- Search through CSS
- Or even take a screenshot just to identify one color
It works but it isn't the fastest workflow.
I wanted something that could pick any color in a single click, copy it instantly, and stay out of the way. After trying several Chrome extensions, I noticed that most of them were missing features I use regularly.
So I decided to build my own.
Introducing Snap Color Picker
Snap Color Picker is a Chrome extension that lets you pick colors from any webpage or your screen and instantly copy them in multiple formats.
It was built with developers, designers, QA testers, and anyone working with colors in mind.
Features
🎨 Pick colors from anywhere
Capture colors from any webpage or directly from your screen.
🔍 Pixel-perfect precision
A built-in 17×17 zoomed magnifier makes it easy to select the exact pixel you want.
🎯 Six color formats
Every picked color is available instantly in:
- HEX
- RGB
- HSL
- HSV
- CMYK
- OKLCH
Each format can be copied with a single click.
🧠 Scan an entire webpage
Instead of clicking individual elements, Snap Color Picker can analyze a page and extract its colors.
It organizes them into:
- Top Colors
- Brand Colors
- Background Colors
- Text Colors
- Border Colors
- Link Colors
This is especially useful when studying a design system or inspecting an existing website.
📚 Built-in history
The extension automatically saves your recently picked colors.
You can:
- View your last 50 colors
- Pin favorites
- Remove colors you no longer need
🌙 Dark & Light mode
Choose the interface that matches your workflow.
🔒 Privacy first
No tracking.
No analytics.
No account required.
Everything stays on your device.
Why I Built It
This is my first published Chrome extension.
Before writing a single line of code, I spent quite a bit of time exploring existing color picker extensions.
Some were fast but lacked useful features.
Others had too many clicks for simple tasks.
Some didn't support modern color formats like OKLCH, while others didn't provide a good way to explore all the colors on a webpage.
My goal wasn't to create another color picker.
It was to build one that combined the features I actually wanted to use every day.
What I Learned
Building a Chrome extension taught me a lot about:
- Chrome Extension APIs
- The EyeDropper API
- Browser permissions
- Optimizing extension performance
- Creating a clean and responsive UI
- Designing for speed and simplicity
It has been a fun project and a great learning experience.
What's Next
I am actively improving Snap Color Picker and adding new features based on user feedback.
If you have ideas or suggestions, I would genuinely love to hear them.
Thanks for reading!