🎨 Color Picker & Converter
Pick any color, see its HEX, RGB, and HSL values. Click any format to copy. Enter a color code to convert between formats.
📖 Understanding Color Formats
HEX is the most common color format in web development. It represents colors as a six-digit hexadecimal number prefixed with #. Each pair of digits represents red, green, and blue intensity from 00 (minimum) to FF (maximum). Example: #4f46e5 is a deep indigo.
RGB (Red, Green, Blue) uses three values from 0-255 for each color channel. Used in CSS as rgb(79, 70, 229). It's intuitive for specifying exact color values programmatically.
HSL (Hue, Saturation, Lightness) is more human-friendly. Hue is a degree on the color wheel (0-360), saturation is intensity (0-100%), and lightness is brightness (0-100%). It's easier to create color variations by adjusting lightness or saturation.
❓ Frequently Asked Questions
HEX is the most common and widely supported. HSL is more intuitive for creating color variations (darken/lighten by adjusting L, desaturate by adjusting S). RGB is useful when you need programmatic color manipulation. All three formats are fully supported in modern CSS.
Color accessibility ensures that text and UI elements have sufficient contrast ratios for people with visual impairments. WCAG 2.1 recommends a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text. Use tools like the WebAIM contrast checker to verify your color combinations.