What it does
Brandon Mathis’s Color Picker connects RGB, HSL, HWB, HSV and OKLCH controls. Paste a colour in one format and inspect the others, including transparency and separate P3 and sRGB previews. Its accompanying guide explains how the colour models differ. The code is open source under the MIT licence.
A colour pasted into any input is recognised and selects the appropriate model. Changes update the other sliders live. Hex inputs accept three or six digits for colour and four or eight digits when transparency is included.
OKLCH describes lightness, colour intensity and hue. The picker keeps its values at full precision without first converting them to sRGB, and shows P3 and sRGB swatches side by side. P3 covers a wider display colour range; gaps in the OKLCH sliders indicate colours beyond the available range.
The guide is useful when familiar-looking controls behave differently. HSL lightness, HSV value and HWB whiteness or blackness are explained with concrete examples. Code is published under MIT. Modified or redistributed copies must keep its copyright and permission notices.
Strengths
- Pasting recognises several colour formats without manually choosing the model.
- Paired previews help compare P3 and sRGB colour ranges.
Watch out for
- Some OKLCH settings fall outside the display colour range.
Best for
- Web designers comparing colour formats and adjusting wide-gamut colours.
Sources
- Color Picker (Oct 28, 2026)
- GitHub - imathis/color-picker: A most excellent multi-mode color picker · GitHub (Oct 28, 2026)
- color-picker/LICENSE at master · imathis/color-picker · GitHub (Oct 28, 2026)