React using Sprite SVG icons
2 min readMay 11, 2020
We use a lot of icons and logos in our web applications and at the end we have a lot of SVG files. But using Sprite, all icons are loaded from one SVG file.
An example of an Sprite file:
To use any icon in React, you need to do this:
import Sprite from "YOUR_ROOT/sprite.svg";
<svg width="24" height="24">
<use xlinkHref={`${Sprite}#backicon`}/>
</svg>
Here is output:
Note: You can not set your own style for elements inside #Shadow-root !