JSFiddle - React, Tailwind, and code Playground

CSS

html {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(99, 130, 169, 0.7))), url('http://lorempixel.com/400/300/'); /* Chrome,Safari4+ */
    background-image: -webkit-linear-gradient(top, transparent, rgba(0,0,0,0.16)), url('http://lorempixel.com/400/300/'); /* Chrome10+,Safari5.1+ */
    background-image:    -moz-linear-gradient(top, transparent, rgba(99,130,169,.7)), url('http://lorempixel.com/400/300/'); /* FF3.6+ */
    background-image:     -ms-linear-gradient(top, transparent, rgba(99,130,169,.7)), url('http://lorempixel.com/400/300/'); /* IE10+ */
    background-image:      -o-linear-gradient(top, transparent, rgba(99,130,169,.7)), url('http://lorempixel.com/400/300/'); /* Opera 11.10+ */
    background-image:         linear-gradient(to bottom, transparent, rgba(99,130,169,0.7)), url('http://lorempixel.com/400/300/'); /* W3C */
    
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-attachment: fixed;
    
    min-height: 100%;
}