Advertisement

🎨 Color Picker

Pick any color and get HEX, RGB, HSL, CMYK values instantly

#818CF8
HEX #818CF8
RGB rgb(129, 140, 248)
HSL hsl(234, 90%, 74%)
CMYK cmyk(48%, 44%, 0%, 3%)
Color History
No history yet — pick colors above
Tints & Shades Palette
Tints (lighter)
Base Color
Shades (darker)
Advertisement

About This Tool

Color Picker

Pick any color and instantly get its HEX, RGB, HSL, and CMYK values — perfect for designers and developers.

Why Use This Tool?

  • Get exact color codes from any color for use in CSS or design tools
  • Convert between HEX, RGB, HSL, and CMYK formats in one click
  • Find the perfect shade by adjusting hue, saturation, and lightness
  • Used by web developers to match brand colors precisely
  • Copy color codes directly to clipboard for immediate use in your project

Overview

Every design decision ultimately comes down to colour. Whether you are a web developer ensuring brand colour consistency, a graphic designer building a mood board, or a marketer matching a logo to a campaign, you need precise colour values in the right format. Our Color Picker tool is a comprehensive colour selection utility that lets you pick any colour and instantly see its exact values in HEX, RGB, HSL, CMYK, and HSV formats. Adjust the hue, saturation, and lightness sliders to find the perfect shade, or type a known hex code to jump directly to it. The tool also shows you related tints and shades of your chosen colour, giving you a mini-palette to work with instantly. All colour format conversions happen in real time — change any value in any format and all other formats update automatically. This eliminates tedious manual colour conversions and ensures you always have the exact code your tool or platform requires. Use it for web design, digital art, UI development, print design, and any creative work involving colour.

How to Use

  • 1

    Use the Color Wheel or Gradient

    Drag on the colour saturation-lightness square and the hue slider to visually select any colour.

  • 2

    Enter a Known Value

    Type a HEX code (e.g. #FF6600), RGB values, or HSL values directly to jump to a specific colour.

  • 3

    Read All Formats

    Instantly see the equivalent values in HEX, RGB, HSL, HSV, and CMYK formats displayed below the picker.

  • 4

    Copy Your Color

    Click any format field or its copy button to copy that specific colour code to your clipboard.

  • 5

    Browse Tints and Shades

    Scroll down to see a range of lighter tints and darker shades of your selected colour to build a monochromatic palette.

Frequently Asked Questions

HEX is a compact 6-character representation of RGB colour (e.g., #FF6600). RGB explicitly states the red, green, and blue channel values from 0–255. Both represent the same colour.
HSL (Hue, Saturation, Lightness) is more intuitive for programmatic colour manipulation. It is easier to create colour variations by adjusting lightness or saturation in CSS.
CMYK (Cyan, Magenta, Yellow, Key/Black) is used for print design. Printers mix ink in these four colours to produce all visible colours on paper.
Use your browser's built-in eyedropper tool (in Chrome/Edge DevTools) or an OS-level colour picker to sample colours from images, then enter the value here.
Screens use the RGB (additive) colour model while printers use CMYK (subtractive). Colours can shift between the two. Always use CMYK values when designing for print.