js regex replace all RGB colors

February 21, 2022

I am trying to use regex to apply algorithm to all rgb in the string.

let st = `
:root {
  --bg-body: rgb(14, 14, 34);
  --bg-wrapper: rgb(14,14,35);
  --color-left-hover: rgb(66,85, 212);
  --bg-header: radial-gradient(circle, rgb(20, 24, 52) 0%, rgb(19, 22, 47) 100%); 
}
`

st.replaceAll(/rgb\(.*\)/g, rgb=>{
    console.log(rgb);
});

[Log] rgb(14, 14, 34) 
[Log] rgb(14,14,35) 
[Log] rgb(66,85, 212) 
[Log] rgb(20, 24, 52) 0%, rgb(19, 22, 47) 100%)

it seems the regex does not work for the last one. refers to Javascript Regular Expression for rgb values, I tried some of the expressions, however I usually got:

TypeError: String.prototype.replaceAll argument must not be a non-global regular expression

or the regex is not returning valid mapping result.

I will be very grateful for your help.

>Solution :

I would use match here:

let st = `
:root {
  --bg-body: rgb(14, 14, 34);
  --bg-wrapper: rgb(14,14,35);
  --color-left-hover: rgb(66,85, 212);
  --bg-header: radial-gradient(circle, rgb(20, 24, 52) 0%, rgb(19, 22, 47) 100%); 
}
`

var matches = st.match(/rgb\(\d+,\s*\d+,\s*\d+\)/g);
console.log(matches);