JSFiddle - React, Tailwind, and code Playground

HTML

<div class="multi_bg_example"></div>

CSS

.multi_bg_example {
    width: 100%;
    height: 400px;
  background-image   : url(https://mdn.mozillademos.org/files/11305/firefox.png),
                       url(https://mdn.mozillademos.org/files/11307/bubbles.png),
                       linear-gradient(to right, rgba(30, 75, 115, 1),  rgba(255, 255, 255, 0));

  background-repeat  : no-repeat,
                       no-repeat,
                       no-repeat;

  background-position: bottom right,
                       left,
                       right;
}