Improvements and suggestions
First of all, your amazing for creating this..props!!

I do got some improvements I would like to suggest:
1. In `<svg..>` use `overflow:hidden` instead of `opacity:0`.
2. In `<svg..>` add `version="1.1"`.
3. Put the `<symbol>` elements in `<defs>` like described in the [SVG 1.1 spec](https://www.w3.org/TR/SVG/struct.html#Head).
4. Add `title` element in every `<symbol>` for accessibility stuff.
5. Add `class`-attribute on `<path>` element .

My current SVG:

```
<svg style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <defs>
        <symbol id="icon-glass" viewBox="0 0 32 32">
            <title>glass</title>
            <path class="path1" d="M30.339 3.321q0 0.625-0.768 1.393l-11.286 11.286v13.714h5.714q0.464 0 0.804 0.339t0.339 0.804-0.339 0.804-0.804 0.339h-16q-0.464 0-0.804-0.339t-0.339-0.804 0.339-0.804 0.804-0.339h5.714v-13.714l-11.286-11.286q-0.768-0.768-0.768-1.393 0-0.411 0.321-0.652t0.679-0.313 0.768-0.071h25.143q0.411 0 0.768 0.071t0.679 0.313 0.321 0.652z"></path>
        </symbol>
        ...
    </defs>
</svg>
```

Further more, it would be awesome if people could define their own settings on the website itself.

For example:
1. Use `<title>` element or not..
2. Setting their own `id`-prefix. Instead of `si-awesome-500px` it could be `myprefix-500px`.
3. Whether or not to minify the SVG.
4. Use `class`-attribute on `<path>` element or not, making it possible to adjust paths with CSS.

Cheers
