JSFiddle - React, Tailwind, and code Playground

HTML

<img src="https://www.multipega.com/img/Multipega_Enlace.png" alt="nathalie yeah" />

<img class="multi_bg_example"/>

CSS

body {
    background: #000;
    
}

.multi_bg_example { 
    background-image : linear-gradient(to right, rgb(255,255,255), rgba(255, 255, 255, 0)), 
         url('https://www.multipega.com/img/Multipega_Enlace.png'); 

    background-repeat : repeat, 
       no-repeat; 

    background-position: right, 
       right; 
}

JavaScript

(function($){
    var imgMirror = function($imgs, spacing){
        $imgs.each(function(){
            var $that, $mirror, dims;
            
            if (!spacing) {
                spacing = 0;
            };
            
            $that = $(this);
            
            dims = [];
            dims[0] = $that.width();
            dims[1] = $that.height();
            
            $mirror = $('<span />', 
                        {css: {'display': 'block', 
                               'background': '-webkit-gradient(linear,left bottom,left top,color-stop(0, rgba(255,255,255,0)),color-stop(1, rgba(255,2255,255,1))), url('  + $that.attr('src') +  ') no-repeat',
                               'background': '-moz-linear-gradient(center bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%), url(' + $that.attr('src') + ') no-repeat',
                               'width': dims[0], 
                               'height': dims[1],
                               '-moz-transform': 'scaleY(-1)',
                               '-webkit-transform': 'scaleY(-1)',
                               'position': 'absolute',
                               'top': $that.offset().top + dims[1] + spacing + 'px',
                               'left': $that.offset().left + 'px'
                              }
                        });
                         
            $that.after($mirror)
            
        });
    };
    
    $(function(){ //document ready
        imgMirror($('img'), 5);
    });    
}(jQuery))