Best Color Picker
Pick colours from the screen, convert formats, generate palettes, check contrast, and export as CSS, SCSS or JSON.
Opens the official Chrome Web Store listing · works in Chrome, Edge and Brave
Colour picking is a small task every designer and front-end developer performs dozens of times a day, and most available extensions do it slightly badly — no magnifier so precision is guesswork, one output format, and a history that vanishes when the popup closes.
Best Color Picker fixes those three things, then adds the parts we found ourselves opening separate tools for: palette generation from a picked colour, WCAG contrast checking between any two colours, and export directly as CSS custom properties, SCSS variables or JSON tokens.
That last feature is what makes it a working tool rather than a utility. Picking a colour is thirty seconds; transcribing a palette into a token file is ten minutes, and it is the ten minutes that gets skipped.
The problem it solves
The precision problem irritates most. Picking a colour from a gradient, a small icon or an anti-aliased edge without magnification means you frequently sample the wrong pixel and do not notice until the colour looks off in context.
The format problem is quieter but adds up. Modern CSS increasingly uses OKLCH; design tools want HEX; some pipelines want RGB triplets. Converting between them by hand is trivial and tedious, which is the exact profile of a task worth automating.
Privacy commitments
- Colour picking and all conversion happen entirely locally.
- History is stored on your device and never transmitted.
- No account, no analytics, no identifiers.
- The extension activates only when you invoke it.
Permissions and why
- activeTabTo read pixels from the page you are actively picking from.
- storageStores your colour history and preferences locally.
- scriptingInjects the loupe overlay when you activate the picker.
What it actually does
Magnified eyedropper
A loupe showing the pixel grid around the cursor, so you select exactly the pixel you mean.
Every useful format
HEX, RGB, RGBA, HSL, HSLA, OKLCH and CSS named colour, copied in one click.
Palette generation
Build tints, shades, complementary and analogous palettes from any picked colour.
WCAG contrast checker
Check any two colours against AA and AAA thresholds for normal and large text, with the ratio shown as well as the verdict.
Export as code
CSS custom properties, SCSS variables or JSON design tokens, ready to paste into your codebase.
Persistent history
Your recent picks are kept across sessions, with the source page recorded.
Three steps, no configuration
Activate the picker
Click the toolbar icon or use the keyboard shortcut. The magnified loupe follows your cursor.
Pick precisely
Magnification shows the exact pixel. Click to capture; it lands in history immediately.
Convert, check or export
Switch format and copy, generate a palette, check contrast, or export the set as CSS, SCSS or JSON.
About Best Color Picker
Including where another tool would serve you better. If you have found a bug or want a feature, tell us on WhatsApp — we read every message.
On Chrome it can use the native EyeDropper API where the operating system permits, which extends picking beyond the page in some configurations. Otherwise picking is limited to web page content, which is a browser security boundary rather than an extension limitation.
A perceptually uniform colour space now supported across modern browsers. Its practical advantage is that adjusting lightness produces visually consistent results across hues, which HSL does not — so a tonal ramp generated in OKLCH has steps that actually look evenly spaced.
Yes — it uses the WCAG relative luminance formula and reports against the 4.5:1 and 3:1 thresholds for normal and large text, at both AA and AAA. It shows the ratio as well as the pass or fail, because the number is often more useful than the verdict.
CSS custom properties, SCSS variables and JSON design tokens. The JSON output is structured so it can be fed straight into a token pipeline or a Tailwind config without reshaping.
How we build and keep a published extension alive
Best Color Picker is built natively on Manifest V3 rather than ported from the older extension architecture, and that distinction matters more than it sounds. Manifest V3 replaced persistent background pages with ephemeral service workers that the browser is free to shut down at any moment. An extension written on the old assumptions works perfectly on a developer’s machine and behaves unpredictably on a user’s machine after their laptop has been asleep for four hours.
So state is persisted to storage and restored rather than held in memory, anything that must survive a worker restart uses an alarm rather than a timer, and long operations are structured as resumable steps. Where network behaviour is modified, it uses declarative rules evaluated by the browser rather than a JavaScript listener on every request — which is why the extension adds no measurable per-request cost to your browsing.
Permissions are the part users are right to scrutinise, and we design for the narrowest set that makes the feature work. Anything optional is requested at the point of use rather than at install, which is both more honest and, for a public extension, materially better for install conversion. Every permission this extension holds is listed on this page with the specific reason it exists.
Maintenance is the unglamorous half. Chrome ships changes on a six-week cadence, target sites change their markup without notice, and Web Store policy is updated periodically with limited warning. We monitor for breakage, publish fixes promptly, respond to reviews, and keep the listing compliant. An extension that is abandoned becomes uninstallable within about two years as platform requirements move — so we treat publishing as a commitment rather than a launch.
We maintain seven live extensions for exactly this reason: it is how we stay genuinely fluent in Manifest V3 behaviour, review policy and the operational reality of shipping to real users — which is what we then bring to the extensions we build for businesses.
Engineering notes
- Manifest V3 native — service worker lifetime assumed, never persistent state in memory.
- Declarative rules for any network behaviour, so there is no per-request JavaScript cost.
- TypeScript throughout, with schema validation at every boundary where data enters.
- Optional permissions requested at the point of use rather than at install.
- Bundled dependencies — no remotely hosted code, which MV3 prohibits and reviewers check.
- Chrome and Edge from one build; Firefox needs a compatibility layer, Safari a native shell.
Want this for your team?
If your staff retype data out of a supplier portal, a government site or a marketplace dashboard, the same engineering applies. A focused internal tool is typically three weeks, deployed through enterprise policy so it installs automatically and cannot be removed by users.
Our other extensions
See all 7No AI Overview — Clean Search
Removes Google’s AI Overview and AI Mode from search results, and optionally hides ads and clutter for a clean, fast page.
v1.0.0 · Live on Chrome Web StoreBackground Remover Pro
Remove backgrounds and watermarks from any image, running entirely locally in your browser.
v1.0.0 · Live on Chrome Web StorePixForge — Image Converter & Editor
Right-click any image on the web to save it in your chosen format. Editor, batch tools and screenshots — all 100% local.
v1.0.1 · Live on Chrome Web StoreWe build extensions for businesses too.
If your team retypes data out of a supplier portal, a government site or a marketplace dashboard, that is usually three weeks of work and hundreds of hours a year recovered.
Direct line
+91 70033 91355Mon–Sat · 9:30 AM – 7:30 PM IST · Sealdah, Kolkata