About ColorPickerCode
I'm Mohamed, a front-end developer. I built ColorPickerCode in January 2026 because I was spending too much time every single day switching between five different browser tabs to do one thing: work with color.
The workflow I was stuck with: pick a color from a client mockup in one tab, convert the HEX to RGB in a second tab, check the contrast ratio in a third, generate a CSS gradient in a fourth, and look up the HSL values for a hover state in a fifth. Every one of those tools was either bloated with ads, slow, or — worst of all — silently uploading my images to a server I knew nothing about.
One afternoon I was working on a confidential rebrand project. I used one of the popular "color picker from image" tools and only afterward noticed that it had uploaded my client's unreleased logo to process it server-side. That was the last time I used anyone else's color tools.
What this site actually is
ColorPickerCode is a single place for the color operations I run every day:
- Image Color Picker — reads pixel data using the browser's Canvas API. Your images never leave your device. No upload, no server, no log.
- HEX ↔ RGB ↔ HSL converters — handle edge cases correctly: alpha channels, shorthand HEX like
#fff, named CSS colors, and the new oklch() format. - Color Wheel — generates complementary, analogous, triadic, and split-complementary schemes with actual HEX codes you can copy directly into CSS.
- CSS Generators — gradients, shadows, and palette tokens in a format you can paste into a stylesheet without editing.
- HEX Code Library — 47,000+ individual color pages, each with RGB, HSL, CMYK values, tints, shades, and CSS snippets.
Why it's built the way it is
Every tool on this site runs entirely in your browser. The Image Color Picker uses HTMLCanvasElement.getContext('2d') and getImageData() to read pixel values locally. The conversions run in JavaScript on your machine. Nothing is sent to a server. Nothing is logged beyond what your hosting provider's standard access logs record (IP, browser type, page visited).
The site is funded by Google AdSense ads. That's the trade-off I made to keep everything free. I display standard display ads, and I've kept the ad placement as non-intrusive as I can manage.
The blog
I write about the technical side of CSS color — what actually happens when a browser parses #FF5733, when CMYK vs RGB matters for your workflow, why HEX and RGB are the same color in different syntax, and the cases where oklch() is worth the migration cost. I write the articles myself, based on problems I run into while maintaining the tools and answering support emails.
Get in touch
If something is broken, if a conversion is giving you the wrong output, or if you have a tool request: [email protected]. I read and reply to everything.