🎨 Color Picker

HEX color codes use the format #RRGGBB where each pair of digits represents Red, Green, and Blue channels in hexadecimal (0-255). For example, #FF0000 is pure red, #000000 is black, and #FFFFFF is white. HEX is the most widely used format in CSS and web design.

Both represent the same colors differently. RGB uses decimal values like rgb(255, 0, 0) while HEX uses hexadecimal like #FF0000. RGB is easier for programmatic manipulation (e.g., blending colors), while HEX is more compact and commonly used by designers in style sheets.

HSL stands for Hue (0-360°), Saturation (0-100%), and Lightness (0-100%). It's more intuitive for humans — you can easily adjust brightness or saturation without recalculating all three channels. For example, to make a color lighter, just increase the L value.

For HEX, use the 8-digit format #RRGGBBAA (e.g., #3b82f680 for 50% opacity). For RGB, use rgba(59, 130, 246, 0.5). For HSL, use hsla(217, 91%, 60%, 0.5). The alpha value ranges from 0 (fully transparent) to 1 (fully opaque).

CSS defines 140 named colors ranging from basic ones (red, blue, green) to specific ones (tomato, cornflowerblue, rebeccapurple). While convenient, named colors can render slightly differently across browsers, so HEX or RGB values are recommended for precise color matching in production.