How I designed, built, and shipped PickHue, a free, open-source, in-page color picker for Chrome. From first public release to the 2.0 Palettes update in five weeks.
Creator & Maintainer · 2026
PickHue
Creator & Founder
Open Source · MIT
Chrome Web Store
A free, open-source, in-page color picker for Chrome. From first public release to the 2.0 Palettes update in five weeks. Brand, product, code, and landing page, end to end.
Role
Design & engineering, end to end. Brand, product, and code.
Timeline
Seven releases in eight weeks, continuously maintained.
Stack
TypeScript · Vite · Manifest V3 · Shadow DOM
01 Overview
PickHue lets you grab any color on any page with a pixel-precise magnifier loupe, copies it to your clipboard in the format you want, and keeps a tidy history of recent picks, all from a clean panel that lives right on the page.
I designed the brand, the product, and the landing page, and wrote every line of TypeScript. It's open source under MIT, and version 2.0 shipped to the Chrome Web Store five weeks after the first public release.
02 The problem
Color pickers are a solved problem. Badly. The tools designers reach for daily are bloated with features they never use, gated behind accounts and subscriptions, or quietly phone home with usage data. And almost all of them live in the browser's default popup: a boxy, sharp-cornered rectangle that never feels like part of your workflow.
I wanted the opposite: a picker that does one job beautifully, respects the person using it, and looks like it belongs on the page. No credit card. No signup. Free forever.
03 Principles
Private by design
The page is sampled locally. No servers, no analytics, no third parties. Every permission exists to serve you, not the product.
Free forever
No accounts, no paywalls, no "pro" tier. MIT-licensed, so anyone can read, audit, or fork every line.
Native to the page
The UI is injected into the page itself, so it earns true rounded corners, real shadows, and a place in your flow.
04 Design decisions
01
An in-page panel, not a popup
PickHue runs as an in-page Shadow DOM panel, so page styles cannot break it. That unlocks true rounded corners, soft shadows, and a UI that stays in your workflow.
02
The loupe
A circular loupe follows the cursor over an exact tab capture. The reticle pixel is the color copied, even on high-DPI screens, with zoom controls and Esc to cancel.
03
Gesture-safe clipboard
Clipboard writes happen synchronously inside the click gesture, avoiding focus-related failures. Every pick copies reliably and confirms with a toast.
04
Color like a professional
HEX, RGB, HSL, and OKLCH are built in. Recents persist; 32 named palettes hold 24 colors each and round-trip through ASE, CSS, hex, or PickHue JSON.
05 Interface
Three moves make the whole product: sample a pixel, read it in whatever format you need, and keep the ones worth keeping. Each was designed to feel effortless.
Pixel-precise loupe
- HEX #87D624
- RGB 135, 214, 36
- HSL 87, 71%, 49%
- OKLCH 0.79 0.21 132
One color, every format
Brand Colors
Named palettes: 24 colors each, export to ASE, CSS, or JSON
06 From v1 to v2
v0.1.0 June 9, 2026
First public release: in-page panel, pixel-precise loupe, HEX / RGB / HSL copy, recent colors, light & dark themes.
v0.1.1 June 14, 2026
Loupe scroll fixes, OKLCH output, picker zoom with Esc dismiss, and a persisted format preference.
v2.0.0 July 8, 2026
The Palettes release: named palettes with a full editor, From Recents multi-select, drag-reorder, import & export (Adobe ASE, CSS variables, JSON, hex), and a system theme switcher.
v2.0.1 → v2.0.3 July 11–15, 2026
Three polish releases in five days: inline rename cues, theme-aware picker UI, concentric swatch radii, smoother scrolling, and dozens of micro-refinements nobody asked for but everyone feels.
v2.0.4 August 1, 2026
Store compliance and a UX pass: dropped a permission the extension never actually needed, rebuilt the color format control as a keyboard-navigable dropdown, and replaced the From Recents modal with a one-click inline strip.
The changelog is the case study. Every release note is a design decision written down.
07 By the numbers
7
releases shipped in eight weeks.
4
formats HEX, RGB, HSL, OKLCH.
40+
current users and counting.
0
bytes of user data collected. Ever.
08 Try it
Install PickHue
GitHub
Free, open source, and private. Colors stay on your machine.
Back to alexwil.com — this site is an interactive desktop and needs JavaScript for the full experience.
