Color Picker
Pick a color and get HEX, RGB, HSL values.
Pick a color and get HEX, RGB, HSL values.
This free Color Picker from KX Toolkit is part of our all-in-one online toolkit. It runs entirely in your browser, so your data never leaves your device for client-side operations. 100% free, forever - no paywall, no credit card, no trial.
How to use the Color Picker
- Drop your image into the upload area, or click to browse.
- Pick the output format, size or compression level.
- Click "Process" - the tool runs and shows a preview.
- Download the result. Most tools delete your file from the server immediately after.
What you can do with the Color Picker
- Optimise images for web pages and faster Core Web Vitals.
- Resize photos for social media specs (1080×1080, 1200×630, etc.).
- Convert HEIC, AVIF or WebP to a more compatible format.
- Strip EXIF metadata before sharing photos online.
Why use KX Toolkit's Color Picker
- Browser-based: Works on Windows, macOS, Linux, iOS and Android - no install, no extension.
- Privacy-first: Client-side tools never upload your data; server-side tools delete files right after processing.
- Mobile-friendly: Full feature parity on phones and tablets - not a stripped-down view.
- Fast: Optimised for instant feedback. No artificial waiting screens, no email-gated downloads.
- One hub for everything: 300+ tools across SEO, text, image, PDF, code, color, calculators and more - skip switching between sites.
Tips for the best results
Compress your image AFTER resizing - running them in that order produces smaller files at the same visual quality.
Related Image Tools
If you find this tool useful, explore the full Image Tools collection or browse our complete tool directory. KX Toolkit is built for marketers, developers, designers, students and anyone who needs a quick utility without signing up for yet another SaaS.
How do I pick a colour and copy its values?
Drag the small circle around the colour field to choose a hue and saturation, then use the slider to set the lightness. The HEX, RGB and HSL values update instantly, and each has a copy button next to it. You can also type a colour value directly into any of the fields and the picker moves to match. This is useful when you want to start from a known colour and tweak it slightly without picking from scratch.
What is the difference between HEX, RGB and HSL?
They are three different ways of describing the same colour. HEX is a six character string used in CSS and design tools because it is compact. RGB lists the red, green and blue components from 0 to 255, which matches how screens emit light. HSL describes hue, saturation and lightness, which is closer to how humans think about colours and is great for adjusting tones. The picker shows all three, so you can copy whichever format your project needs.
Can I save a list of colours I have picked?
Yes. There is a saved colours strip below the picker. Click the plus button to add the current colour to the strip, and click any saved swatch to load it back into the picker. The list is stored in your browser, so it stays between sessions on the same device. To share a palette with someone else, copy the values out and paste them into a message or design file, since the saved list itself is local.
How do I get a transparent or semi transparent colour?
Move the alpha slider, which sits below the lightness slider, to control opacity from fully opaque on the right to fully transparent on the left. The HEX value gains two extra characters at the end to encode alpha, and a separate RGBA value appears for use in CSS. Some older tools still expect six character HEX, so the picker keeps the six character version visible alongside the eight character one to make copying easy.
Can I pick a colour from an image instead of from a wheel?
Yes. Switch to the image picker mode and upload a picture. Click any pixel and its colour fills the picker fields. This is the fastest way to grab the exact shade of a brand colour or a photo accent without guessing. After picking, you can fine tune the result with the sliders if you want a slightly lighter or more saturated version. The image and the picked colours stay in your browser only.
Does the picker support the new wide gamut colour spaces?
The default mode uses sRGB, which is the safest format for the web because every browser supports it. There is also an experimental mode that exposes display P3 values, useful when you are designing for high end phone displays. P3 values are output as the new CSS color function syntax. If you are not sure which to use, stick with sRGB, since wide gamut colours fall back to nearby sRGB values on devices that cannot show them.
No reviews yet
Be the first to share your experience with the Color Picker.