Color Picker

Select colors visually and convert between HEX, RGB, HSL, and CMYK formats. Check WCAG accessibility contrast ratios for your color combinations.

HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)
CMYKcmyk(76%, 47%, 0%, 4%)

WCAG Contrast Checker

3.68:1
Sample Text — The quick brown fox
✗ AA Normal
✓ AA Large
✗ AAA Normal
✗ AAA Large

How to Use Color Picker

  1. Paste or enter your data in the input field above.
  2. The result appears instantly — no button press needed.
  3. Copy the output to your clipboard with one click.

Frequently Asked Questions

What is WCAG contrast?
WCAG contrast ratio measures the difference in brightness between foreground and background colors. A ratio of 4.5:1 is required for normal text accessibility.

Related Tools

NewImage, Color & Design

CSS Gradient Generator

Create beautiful CSS linear and radial gradients with a visual editor and copy the code.

Open tool →
NewImage, Color & Design

CSS Box Shadow Generator

Create CSS box shadows visually with sliders for offset, blur, spread, and color.

Open tool →