const regex = /^\s*(color|background[-color]*||[a-zA-Z0-9-_]+)??[\s:=]*[\s]*(?:(\b(rgb)\s*?\(\s*?(000|0?\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\s*?,\s*?(000|0?\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\s*?,\s*?(000|0?\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\s*?\))|(\b(rgba)\s*?\(\s*?(000|0?\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\s*?,\s*?(000|0?\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\s*?,\s*?(000|0?\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\s*?,\s*?(0|0\.\d*|1|1.0*)\s*?\))\B|(\b(transparent)|(inherit)|(initial)|(currentColor)|(var)[(]([-]{2}[^)]+)[)])|(#([a-fA-F0-9]){3,4})|(#([a-fA-F0-9]){6,8})|(\b(hsl)\s*?\(\s*?(000|0?\d{1,2}|[1-2]\d\d|3[0-5]\d|360)\s*?,\s*?(000|100|0?\d{2}|0?0?\d)%\s*?,\s*?(000|100|0?\d{2}|0?0?\d)%\s*?\)$)|(\b(hsla)\s*?\(\s*?(000|0?\d{1,2}|[1-2]\d\d|3[0-5]\d|360)\s*?,\s*?(000|100|0?\d{2}|0?0?\d)%\s*?,\s*?(000|100|0?\d{2}|0?0?\d)%\s*?,\s*?(0|0\.\d*|1|1.0*)\s*?\)\b))/gm;
// Alternative syntax using RegExp constructor
// const regex = new RegExp('^\\s*(color|background[-color]*||[a-zA-Z0-9-_]+)??[\\s:=]*[\\s]*(?:(\\b(rgb)\\s*?\\(\\s*?(000|0?\\d{1,2}|1\\d\\d|2[0-4]\\d|25[0-5])\\s*?,\\s*?(000|0?\\d{1,2}|1\\d\\d|2[0-4]\\d|25[0-5])\\s*?,\\s*?(000|0?\\d{1,2}|1\\d\\d|2[0-4]\\d|25[0-5])\\s*?\\))|(\\b(rgba)\\s*?\\(\\s*?(000|0?\\d{1,2}|1\\d\\d|2[0-4]\\d|25[0-5])\\s*?,\\s*?(000|0?\\d{1,2}|1\\d\\d|2[0-4]\\d|25[0-5])\\s*?,\\s*?(000|0?\\d{1,2}|1\\d\\d|2[0-4]\\d|25[0-5])\\s*?,\\s*?(0|0\\.\\d*|1|1.0*)\\s*?\\))\\B|(\\b(transparent)|(inherit)|(initial)|(currentColor)|(var)[(]([-]{2}[^)]+)[)])|(#([a-fA-F0-9]){3,4})|(#([a-fA-F0-9]){6,8})|(\\b(hsl)\\s*?\\(\\s*?(000|0?\\d{1,2}|[1-2]\\d\\d|3[0-5]\\d|360)\\s*?,\\s*?(000|100|0?\\d{2}|0?0?\\d)%\\s*?,\\s*?(000|100|0?\\d{2}|0?0?\\d)%\\s*?\\)$)|(\\b(hsla)\\s*?\\(\\s*?(000|0?\\d{1,2}|[1-2]\\d\\d|3[0-5]\\d|360)\\s*?,\\s*?(000|100|0?\\d{2}|0?0?\\d)%\\s*?,\\s*?(000|100|0?\\d{2}|0?0?\\d)%\\s*?,\\s*?(0|0\\.\\d*|1|1.0*)\\s*?\\)\\b))', 'gm')
const str = `rgba(0,0,0,0.1);
background-color: inherit ;
`;
// Reset `lastIndex` if this regex is defined globally
// regex.lastIndex = 0;
let m;
while ((m = regex.exec(str)) !== null) {
// This is necessary to avoid infinite loops with zero-width matches
if (m.index === regex.lastIndex) {
regex.lastIndex++;
}
// The result can be accessed through the `m`-variable.
m.forEach((match, groupIndex) => {
console.log(`Found match, group ${groupIndex}: ${match}`);
});
}
Please keep in mind that these code samples are automatically generated and are not guaranteed to work. If you find any syntax errors, feel free to submit a bug report. For a full regex reference for JavaScript, please visit: https://developer.mozilla.org/en/docs/Web/JavaScript/Guide/Regular_Expressions