JSFiddle - React, Tailwind, and code Playground

HTML

<p><code>background-image</code></p>
<div></div>
<hr>
<p><code>image</code>-element</p>
<image src="https://upload.wikimedia.org/wikipedia/commons/0/02/SVG_logo.svg">
 <hr>
<p>inline-svg</p>    
    <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100">
<path stroke="#000" stroke-width="6" fill="#FFB13B" d="M30,42l-5-5a10,10 0 1,1 12-12l5,5v-7a10,10 0 1,1 17,0v7l5-5a10,10 0 1,1 12,12l-5,5h7a10,10 0 1,1 0,17h-7l5,5a10,10 0 1,1-12,12l-5-5v7a10,10 0 1,1-17,0v-7l-5,5a10,10 0 1,1-12-12l5-5h-7a10,10 0 1,1 0-17z"/>
</svg>

CSS

div {
    background-image: url("https://upload.wikimedia.org/wikipedia/commons/0/02/SVG_logo.svg");
    width: 100px;
    height: 100px;
    background-size: 30px 30px;
}

div {
    width: 30px;
    height: 30px;
    background-position: -140px -263px;
}
div {
    display: block;
    min-width: 30px;
    height: 30px;
    border-radius: 52px;
    display: inline-block;
    vertical-align: middle;
    background-size: 266px 114px;
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/0/02/SVG_logo.svg);
    background-repeat: no-repeat;
    width: 160px;
    height: 160px;
    background-position: -60px 10px;
    -webkit-user-drag: none;
    box-sizing: border-box;
}