What is the difference between HEX and RGB?

HEX (hexadecimal) represents colour as a 6-digit code like #FF5733, where pairs of digits represent red, green, and blue channels in base-16. RGB represents the same values as decimal numbers from 0–255, like rgb(255, 87, 51). Both describe the same colours — HEX is more compact and common in CSS/HTML, while RGB is often easier to read and manipulate programmatically.

HSL stands for Hue, Saturation, and Lightness. Hue is a degree on the colour wheel (0–360°), saturation is the intensity of the colour (0–100%), and lightness is how light or dark it is (0–100%, where 50% is pure colour). HSL is more intuitive for designers because adjusting lightness or saturation feels natural compared to tweaking RGB values.

What is HSB or HSV colour?

HSB (Hue, Saturation, Brightness) — also called HSV (Hue, Saturation, Value) — is similar to HSL but uses Brightness instead of Lightness. In HSB, a brightness of 100% with full saturation gives the pure colour, while 0% brightness is always black. HSB is the model used in most design tools like Photoshop and Figma.

What is a good colour contrast ratio for accessibility?

WCAG 2.1 AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt bold). WCAG AAA requires 7:1 for normal text. A ratio of 1:1 means no contrast (same colour). Use the contrast checker on this page to verify your text and background colours meet accessibility standards.

How do I convert HEX to RGB?

To convert HEX to RGB: split the 6-digit HEX code into three pairs, then convert each pair from base-16 to base-10. For example, #FF5733 splits into FF (255), 57 (87), 33 (51), giving rgb(255, 87, 51). This tool does the conversion instantly — just paste your HEX code.