About this site

A free set of colour tools that run entirely in your browser, explain the theory behind what they do, and never ask you to sign up for anything.

What this site is

colourpicker.tools is a collection of colour utilities for designers, developers and anyone who has ever needed a hex code in a hurry. It converts between formats, checks contrast against accessibility standards, simulates colour blindness, builds gradients and scales, pulls palettes out of photographs, names colours, and exports the results in the formats you actually paste into code.

Everything is free, nothing requires an account, and there is no step between arriving and using it.

Why it exists

Colour tooling tends to come in two unhelpful shapes: a single-purpose widget with no explanation of what it is doing, or a heavyweight design application you have to learn before it will tell you a hex value. Neither is much use when the actual task is “is this text readable on this background” or “give me five shades of this blue”.

So the tools here are deliberately small and fast, and each one is paired with an explanation of the theory underneath. The guides cover what a contrast ratio actually measures, how the colour spaces differ and when to reach for each, how to design for colour blindness, and how to build a scale that works as a design system. The aim is that you leave understanding the decision, not just holding the output.

How it works

Every calculation happens on your device. Colour conversions, contrast ratios and palette extraction all run in JavaScript in your browser — and images you open are read locally and never uploaded. The site is a set of static files with no application server behind it. The privacy policy has the full detail, including the analytics and advertising cookies that are present.

How the colour maths is checked

The conversions between hex, RGB, HSL and OKLCH, and the WCAG contrast-ratio calculation, are covered by an automated test suite that runs on every change — including the awkward cases: pure black and white, out-of-gamut values, and the rounding behaviour that decides whether a pair passes AA or fails it by a hundredth. Contrast results follow the WCAG 2.1 relative luminance formula rather than an approximation, because a tool that tells you something passes when it does not is worse than no tool.

If you find a case where a result is wrong, we would genuinely like to know — thecontact form comes straight to us.

Who builds it

The site is built and maintained by The Idea Works, an independent studio making small, useful web tools. It is one of several — the others include a percentage calculator and a set of text tools. They share an approach: do one thing, do it quickly, explain it properly, and do not charge the visitor in attention for the privilege.

How it is funded

Advertising, and nothing else. There is no premium tier and we do not sell data — we collect none that would be worth selling. Ads pay for the domain, the hosting and the time. They sit in fixed positions that do not move, expand or cover what you came for, and there are none at all on the policy pages or the 404 page.

Colour, color, and where you are

The site is written for a global audience. You will see the British spelling in the brand and the American spelling in code contexts and URLs, because that is what CSS uses and what people search for. Both work everywhere on the site; neither is a mistake.