PickXColorPick color from
DeutschDEOpen editor

Online color picker

Choose any color with the color field, the sliders or a typed value, and see it in every format at once. Copy the value you need or collect the color with the others.

R
G
B
#4F46E5

Values: click one to copy it

Picked colors

Colors you pick show up here. Pick as many as you like. They stay here until you import or clear them.

Opens the editor and adds these colors as one group, with names, shades, contrast checks and code export.

How it works

  1. The color picker with a saturation and brightness field, a hue bar and RGB sliders

    1Choose a color

    Drag in the color field and along the hue bar, move the red, green and blue sliders, or type a HEX, RGB or HSL value.

  2. The chosen color shown large with its name and the list of HEX, RGB, HSL, HSV, OKLCH and CMYK values

    2Copy any format

    HEX, RGB, HSL, HSV, OKLCH and CMYK update while you drag, with the nearest color name. Click a value to copy it, then press “Add to picked colors”.

  3. A grid of picked color swatches with HEX codes and color names

    3Collect your colors

    Every pick lands in the grid below with its HEX code and name. Pick as many as you like, copy them or remove the ones you don't need.

  4. The PickXColor editor showing the imported colors as a named group of cards

    4Open them in the editor

    Press “Import into PickXColor editor” to add all colors as one group, with names, shades, contrast checks and code export.

Frequently asked questions

Which color formats do I get?

HEX, RGB, HSL, HSV, OKLCH and CMYK, all ready to paste into CSS, design tools or print specs. The editor adds Tailwind-style shades, contrast checks and code for CSS, Tailwind, SCSS, Swift and Jetpack Compose.

Can I type in a color I already have?

Yes. Type or paste a HEX code like #4F46E5 into the HEX field, or an rgb() or hsl() value, and press Enter. Every other format is converted instantly.

What is OKLCH?

OKLCH describes a color by lightness, chroma (colorfulness) and hue in a way that matches how we perceive color: colors with the same lightness value really look equally light. Modern CSS supports it with oklch().

How is CMYK calculated?

CMYK is converted from sRGB with the standard formula, without a printer profile. It's a good starting point, but your print shop's profile may give slightly different values.

Is it privacy-safe and GDPR-compliant?

Yes. Your data is opened and processed entirely in your browser. It is never uploaded, stored or sent to a server, and we never see it. There's no account, no tracking and no cookies, and the tool pages don't load anything from third parties. Because none of your file data reaches us, there is no personal data from it that we could process.

The colors you pick are kept in your browser's local storage, so they survive a reload. Clear them with the Clear button or by deleting this site's data.

What can I do with the picked colors?

Copy all HEX codes at once, or press “Import into PickXColor editor”. The editor adds them as one named group on an infinite board, with human color names, HEX, RGB, HSL, OKLCH and CMYK values, Tailwind-style shades, WCAG contrast checks and code export for CSS, Tailwind, SCSS, Swift and Jetpack Compose.

Is it free?

Yes. It's free with no sign-up, no watermark and no limit on how many colors you pick.

More ways to pick colors

Every tool runs in your browser and adds to the same picked colors.