What's the difference between HEX, RGB, and HSL?

HEX is a hexadecimal representation (#RRGGBB). RGB uses three values (0-255) for Red, Green, Blue. HSL represents Hue (0-360°), Saturation (0-100%), and Lightness (0-100%). Each format has different use cases - HEX for CSS, RGB for programming, HSL for color manipulation.

How do complementary colors work?

Complementary colors are opposite each other on the color wheel (180° apart). They create high contrast and vibrant look. For example, blue (#0066FF) has an orange complement (#FF6600). This scheme is ideal for making elements stand out.

What WCAG contrast ratio should I target?

WCAG AA requires 4.5:1 for normal text and 3:1 for large text. WCAG AAA (enhanced) requires 7:1 for normal text and 4.5:1 for large text. For accessibility compliance, we recommend aiming for at least AA level, or AAA for critical content.

Can I save my color history?

The color picker automatically saves up to 20 recent colors in your browser session. For permanent storage, copy the hex values to your notes or design tools. Cloud sync may be added in future updates.

What's the best color scheme for accessibility?

For accessibility, use high-contrast combinations, avoid relying solely on color to convey information, and ensure all text meets WCAG AA standards (4.5:1 contrast). The Contrast Checker tool helps verify compliance. Consider users with color blindness when choosing palettes.

Back to Tools

Color Toolkit

Comprehensive color tools: picker, format converter, palette generator, gradient creator, and contrast checker

Tutorial

#00D4FF

Input Color

Color History

Color Formats

HEX

#00D4FF

RGB

rgb(0, 212, 255)

HSL

hsl(189, 100%, 50%)

CMYK

cmyk(100%, 17%, 0%, 0%)

CSS

--color: #00D4FF;