JSFiddle - React, Tailwind, and code Playground

HTML

<!-- SVG + USE ERROR! -->
<div>
	<svg xmlns="http://www.w3.org/2000/svg">
		<use xlink:href="https://svgshare.com/i/7q9.svg"></use>
	</svg>
</div>

<!-- img option -->
<div>
	<img src="https://svgshare.com/i/7q9.svg"/>
</div>

<!-- object option -->
<div>
	<object data="https://svgshare.com/i/7q9.svg"></object>
</div>

<!-- background-image + URL -->
<div>
	<ico class="icon"></ico>
</div>

CSS

body {
	display:flex;
}

div {
	border:1px solid black;
	padding:25px;
	color:red;
	flex:0 0 100px;
}

svg,
img,
object,
ico {
	height:100px;
	width:100px;
	cursor:pointer;
	fill:currentColor;
}

.icon {
	display:block;
	background-image: url(https://svgshare.com/i/7q9.svg);
	background-repeat:no-repeat;
	background-size:100px;
	background-position:center;
}