Online Color Picker
Pick a color and copy its code in any format.
- 100% Free
- No Sign Up
- Works in Your Browser
Color picker
Pick a color and copy it as hex, RGB or HSL
More Color Tools
View all tools- Image color pickerClick any pixel in a photo to get its color code
- Color name finderFind the closest named color for any hex code
- Palette generatorGenerate color palettes and lock the ones you like
- Contrast checkerCheck text and background contrast against WCAG
- Hex to RGBConvert hex color codes to RGB values
- Palette from imageExtract a color palette from any photo
- Tailwind color generatorMake a 50-950 Tailwind color scale from one color
- Color wheelFind color harmonies on an interactive wheel
- Gradient generatorBuild CSS linear and radial gradients
Every everyday color tool, right in your browser.
No software. No uploads. No signup.
Browse all 28 tools- Color tools
- 28
- Named colors
- 139
- Curated palettes
- 216
How to use the color picker
Three steps, all in your browser.
- 1
Pick a color
Use the picker or type a code in any format.
- 2
Fine-tune the pick
Adjust the color or pick again. Every format updates at once.
- 3
Copy the codes
Copy any color code in one click, or share the page link.
Online Color Picker: what to know
The color picker lets you choose any color visually, with a saturation and brightness area and a hue slider, or by typing a code. The selected color is shown in ten formats at once: hex, RGB, HSL, HSV, HWB, CMYK, OKLCH, OKLab, CIE Lab and LCH, each with a copy button.
Under the picker you'll find the color's nearest CSS name and a strip of lighter tints and darker shades. That covers most of what you need when choosing a color for a design: the code, a name to talk about it, and variations for hover states and backgrounds. To check whether text on it will be readable, take it to the contrast checker.
Hex and RGB describe the same thing: amounts of red, green and blue light from 0 to 255. HSL and HSV rearrange those numbers into hue, saturation and lightness or brightness, which is easier to adjust by hand. OKLCH and Lab go further and are designed around how people actually perceive lightness and color.
Popular uses
- Choosing brand, button and background colors
- Getting a CSS color value for a web project
- Translating a color between design tools that use different formats
- Checking a color's name and readability at a glance
Tips for the best result
- Paste a code from your stylesheet to start from a color you already use.
- For text colors, test the pair in the contrast checker: 4.5:1 or more passes WCAG AA for body text.
- Use OKLCH when you want to change lightness without the hue shifting.
Read how JustYourPalette works, browse named colors and curated palettes, and see our privacy details. Colors you enter and images you open are processed in your browser and are never sent to our server.