Several people have given me feedback on my grunt-svg-symbols
plugin. They especially liked the idea of changing color values to currentColor
, so that the icons inherit the text color. Therefore the updated plugin has an option to automatically replace the values of all fill
and stroke
attributes for you.
grunt.initConfig({
svg_symbols: {
options: {
currentColor: true
},
files: {
'icons/user.svg': ['svg/user/*.svg']
}
},
});
The only prerequisite is of course, that your source SVG files contain some fill
or stroke
attributes. These can also be defined on groups or parent elements as the optimizer does a great job in merging them down to single paths.
<svg class="u-hidden">
<symbol id="mail" viewBox="0 0 24 24">
<path fill="currentColor" d="M77.766 17.152..."/>
</symbol>
</svg>
If you encounter any bugs or have a feature request please let me know. You can also report issues directly to the GitHub repository of the grunt-svg-symbols
plugin.