Take the separate background gradient values and save to a new array

Question

I have these background attributes of an element:

"background: rgba(0, 0, 0, 0) linear-gradient(0.25turn, rgb(117, 117, 117), rgb(46, 184, 46), rgb(21, 21, 21), rgb(166, 166, 166)) repeat scroll 0% 0%;"

How can I take the 4 different colors of the gradient and separate them into an array like this:

  [117,117,117],[46,184,46],[21,21,21],[45,175,230],[166,166,166],

I think the way I’m trying is wrong: (I left well divided to understand better)

    var colorsP = "background: rgba(0, 0, 0, 0) linear-gradient(0.25turn, rgb(117, 117, 117), rgb(46, 184, 46), rgb(21, 21, 21), rgb(166, 166, 166)) repeat scroll 0% 0%;"

    colorsP = colorsP.split('0.25turn, ');
    colorsP = colorsP[1];
    colorsP = colorsP.split(') ');
    colorsP = colorsP[0];
    colorsP = colorsP.split('rgb');
    colorsP = colorsP.filter((value)=>value!='');
    
    console.log(colorsP);

Answer 1

I think that solves your problem: Using a regular expression to identify the contents of each rgb(R,G,B), where R, G and B are numerical values:

From these, iterate for each string rgb(R, G, B) and use another ER to identify numerical values. After that, iterate through the results and place each one in an array.

Finally, create an array with the previous arrays.

const er = new RegExp(/rgb\(.*?\)/gi); //ER que identifica os textos 'rgb(R, G, B)'
const texto = "background: rgba(0, 0, 0, 0) linear-gradient(0.25turn, rgb(117, 117, 117), rgb(46, 184, 46), rgb(21, 21, 21), rgb(166, 166, 166)) repeat scroll 0% 0%;"; // o texto completo

matches = [... texto.matchAll(er)]; //criando um vetor com os resultados encontrados no texto completo

valores = matches.map(function(v){ // passando por cada string do vetor acima (que tem o conteúdo similar a 'rgb(R, G, B)'
    erV = new RegExp(/\d+/g); //criando uma ER para identficar os números dentro do texto atual
    resultados = [... v[0].matchAll(erV)]; // encontrando todos 
    arrayRetorno = resultados.map(function(vr){ //passando por cada um deles e...
         return parseInt(vr[0]); // ... retornando como números inteiros
    })
    return arrayRetorno; // devolvendo o vetor atual para o 'vetor de vetores'
}); 

console.log(valores);

Will result in:

[[117, 117, 117], [46, 184, 46], [21, 21, 21], [166, 166, 166]]

Remember that any change that affects the pattern rbg(R, G, B) (for example of rgb(0,0,0) for #000000) will cause failures.