Same icon different sizes with gulp svg sprite?

Question

Im using gulp-svg-sprite https://github.com/jkphl/gulp-svg-sprite

Is it possible to use the same icon at different sizes? Prior to spriting this was easy and in fact was one of the things I like most about SVGs:

http://codepen.io/anon/pen/qZQvYN

.icon-small,
.icon-large {
    background-image: url(https://lincolnloop.com/static/assets/img/lincolnloop-mark.9b93136b4561.svg);
    background-size: 100% 100%;
}

.icon-small {
    width: 50px;
    height: 50px;
}

.icon-large {
    width: 100px;
    height: 100px;
}

However now that I'm using a sprite I cant use this solution as the background-size comes from the mixin. Even if I overwrote this then the background-position would be made wrong.

http://codepen.io/anon/pen/JXezaK

.icon-small,
.icon-large {
    background-image: url(https://scotthsmith.com/projects/social-icons/blue/IconGrid.svg?v1.11);
  background-size: auto 400px;
  border: 1px solid grey;
}

.icon-small {
    width: 50px;
    height: 50px;
}

.icon-large {
    width: 100px;
    height: 100px;
}

Answer 1

I suppose you don't have text on your svg. Then using transform: scale(2) should fix it:

.icon-large {
  width: 50px;
  height: 50px;
  transform: scale(2)
}

This SO question seem to be discussing similar issue.