Color Tools

Color Tools brings together everything you need to work with colour on screen — not a full design application, but 14 focused tools that each handle one specific colour task well: converting a hex code into its HSL or CMYK equivalent, checking whether two colours meet the WCAG accessibility threshold so your text is actually readable, generating a harmonious palette from a single starting colour, picking a precise colour from any pixel in an uploaded image, or simulating how that image would look to someone with a colour vision deficiency. Every tool here runs entirely in your browser. There is no server round-trip between picking, converting or analysing a colour and seeing the result, which means everything updates instantly as you make changes, and nothing you work with — a client's brand colours, a design mockup, an image that might contain sensitive visual information — is ever uploaded, transmitted, or stored anywhere. The colour-blindness simulator and the image-based tools use the HTML5 Canvas API to read and transform pixel data, all within the browser's own rendering engine, so even the file you upload never actually leaves your device. The tools fall into a few natural groups. Conversion tools (Color Converter, CMYK to Pantone, Color Name Finder) translate colours between different naming systems — hex, RGB, HSL, HSV, CMYK, CSS named colours, and approximate Pantone references — so you can work in whatever system your current tool or context requires. Generation tools (Palette Generator, Gradient Generator, Random Color, Tint & Shade Generator, Material Color Generator) create new colour combinations from a starting point, whether you need a full Material Design swatch system for an app, a CSS gradient for a website hero section, or 21 lighter-to-darker variations of a single brand colour for a design system. Analysis tools (Contrast Checker, Color Mixer) measure or combine colours to answer specific practical questions — does this grey text on that blue background pass AA at normal size, and what colour do you get when you blend these two 30/70. And the image-based tools (Image Color Picker, Image Palette Extractor, Color Scheme from Image, Color Blindness Simulator) extract colour information from uploaded pictures or transform them to show how they'd appear under different types of colour vision, turning an image into a usable, quantified colour reference. One tool worth calling out specifically is the Colour Blindness Simulator, which applies the standard Brettel (1997) transformation matrices for the four most common forms of colour vision deficiency — protanopia, deuteranopia, tritanopia and achromatopsia — to every pixel of an uploaded image, showing a side-by-side comparison of the original and the simulated view. This is a genuinely useful accessibility check for anyone designing charts, maps, user interfaces or brand materials where colour alone conveys information, and it runs without any image ever being transmitted to a server.