iamryanyu

// reset icon; this is recommended properties
.icon {
  fill: currentColor;
  height: 1em;
  overflow: hidden;
  vertical-align: -.15em;
  width: 1em;
}

// icon size; use font-size

iamryanyu

<svg class="icon icon-medium icon-red">
  <use xlink:href="styles/mysource_files/sprite.svg#icon-name"></use>
</svg>

iamryanyu

<svg>
  <use xlink:href="styles/mysource_files/sprite.svg#icon-name"></use>
</svg>

iamryanyu

<script src="js/svgxuse.min.js"></script>
<!--[if IE 9]>
<script src="js/vendor/svg4everybody.js"></script>
<script>svg4everybody();</script>
<![endif]-->

iamryanyu

var svgConfig = {
  svg: {
    namespaceClassnames: false
  },
  mode: {
    symbol: {
      dest: '.',
      sprite: 'sprite.svg'
    }
  }