SVG Sprite template

SVG Sprite template

<!-- FILENAME.SVG -->
<svg display="none" width="0" height="0" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <defs>
        <symbol id="CUSTOM_ID" viewBox="0 0 WIDTH HEIGHT">
            <title>TITLE</title>
            <!-- IT'S EASIEST TO MAKE A COMPOUND PATH AND OPTIMIZED FOR SIMPLICITY -->
            <path fill="currentColor" class="CUSTOM_CLASS" d=""/> <!-- currentColor will be determined by parent's color -->
        </symbol>
        <symbol id="CUSTOM_ID" viewBox="0 0 WIDTH HEIGHT">
            <title>TITLE</title>
            <path fill="currentColor" class="CUSTOM_CLASS" d=""/>
        </symbol>
    </defs>
</svg>

<!--USAGE in HTML -->
<svg role="img" title="TITLE"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/RELATIVE/PATH/TO/FILE/FILENAME.svg#symbolID"></use></svg>