Analyse der CSS-Gradientenregel mit Javascript Regex

In meiner CSS-Datei habe ich eine Verlaufsregel wie diese:

background-image:linear-gradient(to right, #FF0000 0%, #00FF00 20px, rgb(0, 0, 255) 100%);

Ich möchte alle Teile dieser Saite bekommen. Erwartete Ausgabe ist:

linear-gradient
to right
#FF0000 
0%, 
#00FF00 
20px, 
rgb(0, 0, 255) 
100%

Es war zu schwierig für mich, an der ganzen Saite zu arbeiten, also habe ich beschlossen, sie in Teile zu teilen.

linearer Gradient

.*gradient[^\(]?

Farben

rgb ?\([ 0-9.%,]+?\)|#[0-9a-fA-F]{3,6}\s[0-9]{1,3}[%|px]|#[0-9a-fA-F]{3,6}|(aqua|black|blue|fuchsia|gray|green|lime|maroon|navy|olive|orange|purple|red|silver|teal|white|yellow){1}(\s[0-9]{1,3}\s*[%|px]?)?

nach rechts

(?<=\()(.*(top|left|right|bottom|center).*?)(?=,)

aber der letzte reguläre Ausdruck funktioniert in JS nicht, weil er keinen regulären Ausdruck hinter sich hat. Kurz muss ich hier alles zwischen "(" und ","