Pick colors and convert between HEX, RGB, HSL with WCAG contrast checker
#1E40AFrgb(30, 64, 175)hsl(226, 71%, 40%)Sample Text
Contrast Ratio: 8.72:1
Create beautiful CSS gradients with live preview and code export
Convert colors between HEX, RGB, HSL, HSV and CMYK formats
Generate harmonious color palettes from a base color
Check color contrast ratio for WCAG accessibility compliance
Color Picker & Converter is a free online tool that lets you select any color and instantly convert it between the most widely used color formats: HEX, RGB, and HSL. Whether you are designing a website, building a brand identity, or fine-tuning a user interface, having precise control over color values is essential. This tool makes it easy to find the exact shade you need and translate it into whatever format your project requires. Beyond simple color conversion, the tool includes a built-in WCAG contrast checker that evaluates the readability of your chosen foreground and background color combination. The Web Content Accessibility Guidelines (WCAG) define minimum contrast ratios to ensure that text remains legible for users with visual impairments. A contrast ratio of at least 4.5:1 is required for normal text (AA level), while large text needs at least 3:1. The AAA level demands 7:1 for normal text and 4.5:1 for large text. Understanding color theory and accessibility standards is critical for modern web design. Poor color contrast is one of the most common accessibility failures on the web, affecting millions of users who have low vision or color blindness. This tool helps you make informed color choices that are both visually appealing and inclusive. All processing runs entirely in your browser — no data is sent to any server.
HEX to RGB: #FF5733 → R=255, G=87, B=51 Each pair of hex digits represents one channel (Red, Green, Blue) in the range 0–255. RGB to HSL: Normalize R, G, B to 0–1 range, then: L = (max + min) / 2 S = (max - min) / (1 - |2L - 1|) if L ≠ 0 or 1 H = depends on which channel is max WCAG Contrast Ratio: Ratio = (L1 + 0.05) / (L2 + 0.05) where L1 is the relative luminance of the lighter color and L2 is the relative luminance of the darker color.