TOOLS · COLOR PICKER
Pick a color, get every format at once.
Choose a color and see its HEX, RGB, RGBA, HSL, HSLA, HSB, and CMYK values simultaneously — each one ready to copy. Mix two colors together below to preview the blend.
Why So Many Color Formats?
Different tools expect color in different formats. CSS and web design almost always use HEX or RGB/RGBA. Design tools and older UI frameworks often work in HSL, which is easier for a human to reason about ("a darker version of this" is just lowering the lightness number). Print design uses CMYK, since printers mix cyan, magenta, yellow, and black ink rather than emitting red, green, and blue light. Rather than converting one format at a time, this tool shows all of them for whatever color you pick, so you can just copy whichever one the task in front of you needs.
How This Tool Works
All the color math — HEX to RGB, RGB to HSL, RGB to HSB, RGB to CMYK, and the color mixing — runs locally in your browser using standard, well-known conversion formulas. Nothing about the color you pick is sent anywhere.
How the Mixer Works
The mixer blends two colors by linearly interpolating each RGB channel between them, weighted by the ratio slider. At 0% you get the first color exactly, at 100% you get the second color exactly, and at 50% each channel is the midpoint between the two — the same basic idea as a paint mixing slider in a design tool.
Common Uses
- Converting a HEX color from a design file into the RGB or HSL value a CSS rule needs.
- Getting the CMYK equivalent of a brand color for a print-ready file.
- Previewing a blend between two brand colors before picking a final shade.
- Quickly checking what a hex code actually looks like before using it.
Frequently Asked Questions
Is HSB the same as HSV?
Yes — HSB (Hue, Saturation, Brightness) and HSV (Hue, Saturation, Value) are two names for the exact same color model. Different software just uses different naming.
Why might the same color look slightly different in HSL after converting back and forth?
HSL values are normally shown as whole-number degrees and percentages, so a tiny amount of rounding happens converting to HSL and back — the same rounding you'd see in any color tool. It's small enough to be invisible, usually within a couple of RGB units.
Does the mixer do the same kind of blending as mixing real paint?
Not quite — this mixes colors the way screens do, by blending red, green, and blue light values directly. Real paint mixing is subtractive (mixing pigments) and can produce different results, especially with complementary colors like blue and orange producing a muddy brown on paper but a gray-ish blend on screen.
Can I type a hex code directly instead of using the color wheel?
Yes — the hex field next to the color swatch accepts typed input, with or without the leading #, and in either 3-digit or 6-digit form.