Home›Color Tools

🎨 Free Color Tools

Convert HEX, RGB, HSL colors. Check contrast ratios and generate color palettes — instantly in your browser.

Colour tools are essential for designers and developers. The converter translates instantly between HEX (used in CSS and HTML), RGB (used in design software) and HSL (intuitive for adjusting hue and lightness). The contrast checker verifies WCAG accessibility compliance for text and background colour pairs. The palette generator creates harmonious colour schemes from any base colour.

Advertisement
Pick or enter a color
Click the swatch or type in any field below
HEX
#2563eb
RGB
37, 99, 235
HSL
224°, 83%, 53%

Click any color value to copy to clipboard.

Advertisement

Related Tools

🖥️

CSS Unit Converter

px to rem, em, vh, vw

 ✏️

Text Tools

Word count, case convert

 📦

Compress Image

Reduce file size

 📱

QR Generator

Create QR codes

Free Online Colour Tools for Designers and Developers

The colour converter instantly translates between HEX (used in CSS and HTML), RGB (red, green, blue values 0–255), and HSL (hue, saturation, lightness) — all three formats widely used in web design and development. Type in any format and all others update live. The contrast checker calculates the contrast ratio between two colours and tells you whether they meet WCAG 2.1 accessibility standards (AA requires 4.5:1 for normal text, AAA requires 7:1). The palette generator creates harmonious colour sets from a base colour using colour theory rules (complementary, analogous, triadic).

All tools run entirely in your browser — no upload, no account. Use them for web design, graphic design, accessibility audits or any project where you need accurate colour values. Click any result to copy it to your clipboard.

Frequently Asked Questions

Enter a HEX code (e.g. #FF5733) in the HEX field and the RGB and HSL values appear instantly. You can also paste without the # symbol.
WCAG (Web Content Accessibility Guidelines) defines minimum contrast ratios between text and background colours to ensure readability. AA level requires 4.5:1 for normal text, AAA requires 7:1. The contrast checker shows your ratio and whether it passes each level.
HSL stands for Hue, Saturation, Lightness. Hue is the colour angle (0–360°), Saturation is how vivid the colour is (0–100%), and Lightness controls how light or dark it is (0–100%). HSL is often more intuitive for designers than RGB.
A complementary colour sits directly opposite on the colour wheel (180° away). Complementary pairs create high contrast and visual energy. The palette generator also offers analogous (adjacent colours) and triadic (120° apart) schemes.
Yes — click any colour value or palette swatch to copy it to your clipboard immediately.