Color Picker & Format Converter

Pick, convert, and inspect color values across HEX, RGB, HSL, HSV, and CMYK formats. Test WCAG contrast accessibility and extract colors from images.

Color Picker & Format Converter

Pick colors, convert values, and inspect contrast ratios

#3B82F6

RGB Color Sliders

Red (R)59

Green (G)130

Blue (B)246

Recent Palette History

Converted Color Formats

HEX Code

#3B82F6

RGB

rgb(59, 130, 246)

RGBA

rgba(59, 130, 246, 1.0)

HSL

hsl(217, 91%, 60%)

HSV / HSB

hsv(217, 76%, 96%)

CMYK

cmyk(76%, 47%, 0%, 4%)

WCAG 2.1 Contrast Accessibility

White Text

3.68:1AA PASS

Dark Text

4.82:1AAA PASS

Generated Color Harmonies

Complementary

Triadic

Shades & Tints

Color Formats Explained

Different design and software environments use specific color models:
• HEX: 6-digit hexadecimal format used primarily in HTML and CSS (`#3B82F6`).
• RGB / RGBA: Red, Green, Blue channel intensity (0-255) used in screen graphics and digital rendering.
• HSL: Hue, Saturation, Lightness — intuitive model for creating CSS design system variations.
• CMYK: Cyan, Magenta, Yellow, Key (Black) used in physical printing presses.

Frequently Asked Questions

What color formats does this tool convert?: This tool converts color values across HEX, RGB, RGBA, HSL, HSV (HSB), and CMYK formats in real-time.
How does the Image Color Inspector work?: Upload any image (PNG, JPEG, WebP, SVG) and click or hover over any pixel. The tool uses HTML5 Canvas to sample exact RGB and HEX color codes directly in your browser memory.
What is the WCAG Contrast Ratio Checker?: The WCAG contrast ratio checks text readability against light and dark background colors according to Web Content Accessibility Guidelines (WCAG 2.1). Ratios of 4.5:1 pass AA guidelines, while 7:1 passes AAA guidelines.
Can I use the system EyeDropper API?: Yes! Browsers supporting the native EyeDropper API (such as Chrome, Edge, and Opera) allow you to pick any color pixel directly from your desktop screen outside the browser window.

Online Measuring Tape

Measure small physical objects on your screen with a calibrated ruler.

Online Protractor

Measure angles online with an interactive virtual protractor.

Dead Pixel Checker

Test your monitor or smartphone display for stuck or dead pixels.

Color Formats Explained

Frequently Asked Questions

What color formats does this tool convert?

This tool converts color values across HEX, RGB, RGBA, HSL, HSV (HSB), and CMYK formats in real-time.

How does the Image Color Inspector work?

Upload any image (PNG, JPEG, WebP, SVG) and click or hover over any pixel. The tool uses HTML5 Canvas to sample exact RGB and HEX color codes directly in your browser memory.

What is the WCAG Contrast Ratio Checker?

The WCAG contrast ratio checks text readability against light and dark background colors according to Web Content Accessibility Guidelines (WCAG 2.1). Ratios of 4.5:1 pass AA guidelines, while 7:1 passes AAA guidelines.

Can I use the system EyeDropper API?

Yes! Browsers supporting the native EyeDropper API (such as Chrome, Edge, and Opera) allow you to pick any color pixel directly from your desktop screen outside the browser window.