Pick any color and instantly convert between HEX, RGB, HSL, and CMYK formats.
Click the color swatch or use the color wheel input to select any color. The HEX, RGB, HSL, and CMYK values update instantly. Click any value box to copy it to your clipboard. You can also type a HEX code directly into the HEX input field to jump to a specific color precisely.
HEX is the standard for web development — every CSS stylesheet and HTML file uses it. RGB is the native language of screens and JavaScript canvas operations. HSL is preferred for design systems because it is intuitive: keep hue and saturation constant while varying lightness to generate tints, shades, and tones programmatically. CMYK is essential for print production, where ink mixing replaces light mixing.
When building a color palette for a website or app, start with HSL to define your primary hue, then derive lighter and darker variants by adjusting lightness. Use the HEX value in your CSS variables. Always check contrast ratios between text and background colors — the WCAG AA standard requires at least 4.5:1 contrast for normal text. Approximately 8% of men have some form of color vision deficiency, so never rely on color alone to convey information.
Blue conveys trust and reliability — dominant in banking and technology. Orange signals energy and friendliness — effective for CTAs and creative brands. Green suggests health, growth, and safety. Red commands attention and urgency but can create anxiety if overused. Choose primary colors that align with your brand's intended emotional tone and the expectations of your target audience.