JAVASCRIPT
Validate Hex Color Codes
Validate hex color codes (e.g., #RRGGBB, #RGB, #RRGGBBAA, #RGBA) using a concise JavaScript regular expression for UI development and input validation.
const hexColorRegex = /^#([a-f0-9]{3}|[a-f0-9]{4}|[a-f0-9]{6}|[a-f0-9]{8})$/i;
function isValidHexColor(hex) {
return hexColorRegex.test(hex);
}
// Examples
console.log(isValidHexColor("#FFF")); // true (3-digit)
console.log(isValidHexColor("#FF00FF")); // true (6-digit)
console.log(isValidHexColor("#f0c")); // true (case-insensitive, 3-digit)
console.log(isValidHexColor("#FF00FF88")); // true (8-digit with alpha)
console.log(isValidHexColor("#1234")); // true (4-digit with alpha)
console.log(isValidHexColor("ABC")); // false (missing #)
console.log(isValidHexColor("#GGGGGG")); // false (invalid characters)
How it works: This JavaScript snippet provides a regular expression to validate standard hex color codes. It supports both 3-digit (`#RGB`), 4-digit (`#RGBA`), 6-digit (`#RRGGBB`), and 8-digit (`#RRGGBBAA`) formats, optionally including an alpha channel. The `i` flag makes the validation case-insensitive, ensuring flexibility when parsing color inputs in web design tools or CSS-related applications.