JSFiddle - React, Tailwind, and code Playground

HTML

<div class="element" style="background-color:red !important;height:100px;width:100px;" ></div>
<button>Get CSS</button>
<div id="css"></div>

<div class="newElement" style="background-color:blue;height:100px;width:100px; margin-top:10px" ></div>

CSS

.element {
       background: #ce4f57 !important;
       background: -moz-linear-gradient(top, #ce4f57 0%, #b7333b 100%) !important;
       background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ce4f57), color-stop(100%, #b7333b)) !important;
       background: -webkit-linear-gradient(top, #ce4f57 0%, #b7333b 100%) !important;
       background: -o-linear-gradient(top, #ce4f57 0%, #b7333b 100%) !important;
       background: -ms-linear-gradient(top, #ce4f57 0%, #b7333b 100%) !important;
       background: linear-gradient(to bottom, #ce4f57 0%, #b7333b 100%) !important;
       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce4f57', endColorstr='#b7333b', GradientType=0) !important;
     }

JavaScript

$("button").click(function(){    
    var css = $('.element').css('background-image');
    var gradient = css.split('0%')[0].split('linear-gradient(')[1]
    $('#css').html(gradient);
    $('.newElement').css('background-color',gradient);
});