svg example

HTML

<script src="http://www.useragentman.com/tests/pointerEvents/js/jquery.cycle.all.js"></script>
<script src="http://www.useragentman.com/tests/pointerEvents/js/tv.js"></script>
<?xml version="1.0" encoding="utf-8"?>
  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
   <symbol viewBox="-281 404.89 32 32" id="bag">
<g>
  <g>
    <g>
      <path d="M-211.66,427.97c-0.12-1.33-1.24-2.36-2.58-2.36h-12.95v-5.18c0-8.57-6.97-15.54-15.54-15.54
        c-8.57,0-15.54,6.97-15.54,15.54v5.18h-12.95c-1.34,0-2.46,1.02-2.58,2.36l-5.18,56.99c-0.06,0.72,0.18,1.44,0.67,1.98
        c0.49,0.54,1.18,0.84,1.91,0.84h67.35c0.73,0,1.42-0.31,1.91-0.84c0.49-0.54,0.73-1.25,0.67-1.98L-211.66,427.97z M-253.1,420.43
        c0-5.71,4.65-10.36,10.36-10.36s10.36,4.65,10.36,10.36v5.18h-20.72V420.43z M-273.57,482.6l4.71-51.81h10.59v5.9
        c-1.54,0.9-2.59,2.55-2.59,4.46c0,2.86,2.32,5.18,5.18,5.18s5.18-2.32,5.18-5.18c0-1.91-1.05-3.56-2.59-4.46v-5.9h20.72v5.9
        c-1.54,0.9-2.59,2.55-2.59,4.46c0,2.86,2.32,5.18,5.18,5.18s5.18-2.32,5.18-5.18c0-1.91-1.04-3.56-2.59-4.46v-5.9h10.59
        l4.71,51.81H-273.57z"/>
    </g>
  </g>
</g>
</symbol>
</svg>

<svg class="icon-bag">
  <use xlink:href="#bag"></use>
</svg>

CSS

.icon-bag {
  width: 20px;
  height: 20px;
  fill: red;
}