JSFiddle - React, Tailwind, and code Playground

HTML

<div id="fancy"></div>

CSS

body, html {
    height: 100%;
    width: 100%;
}
#fancy {
    background: transparent url(http://placekitten.com/g/200/100) 0 0 no-repeat;
    height: 400px;
    width: 800px;
}
@media only screen and (min-width:400px) {
    #fancy {
        background-image: url(http://placekitten.com/g/400/200);
    }
}
@media only screen and (min-width:500px) {
    #fancy {
        background-image: url(http://placekitten.com/g/500/250);
    }
}
@media only screen and (min-width:800px) {
    #fancy {
        background-image: url(http://placekitten.com/g/800/400);
    }
}