1
Pick a Color
Click on the color preview box to open the system color picker, or use the Random button for inspiration.
Advanced Color Picker
Pick colors, convert between HEX, RGB, and HSL, check contrast ratios, and generate beautiful palettes instantly.
100%
Red
0
Green
212
Blue
170
Alpha
1.0
Contrast Checker (WCAG)
Aa
White Text on Color
-
Aa
Black Text on Color
-
Ratio > 4.5:1 passes AA standard for normal text. > 7:1 passes AAA.
Generated Palette
How to Use the Color Picker
2
Adjust Opacity
Use the opacity slider to create transparent colors (RGBA/HSLA). Perfect for overlays and UI design.
3
Copy & Verify
Copy the color code in your preferred format (HEX, RGB, HSL) and check the contrast ratio for accessibility.
Frequently Asked Questions
What color formats does this tool support?
This tool supports the three most common web color formats: HEX (Hexadecimal), RGB (Red Green Blue), and HSL (Hue Saturation Lightness). It also handles alpha channels for transparency in RGBA and HSLA formats.
How do I check if my color is accessible?
The tool automatically calculates the contrast ratio of your selected color against white and black text backgrounds. According to WCAG guidelines, a ratio of 4.5:1 is required for AA compliance (normal text), and 7:1 for AAA compliance.
Can I save the colors I pick?
While there isn't a permanent save database, you can instantly copy the color code to your clipboard. The "Generated Palette" section also creates variations of your color that you can use to build a cohesive theme.
Perfect For
Designers and developers working with color
UI Designers
Create interface themes
Developers
Get code values instantly
Accessibility
Ensure readable contrast
Artists
Generate color palettes