Font-Awesome-SVG-PNG
Font-Awesome-SVG-PNG copied to clipboard
Specify color does not work
I have tried to get it to generate a non black color and failed.
This is what I tried:
./font-awesome-svg-png.js --color CCC --sizes 64
./font-awesome-svg-png.js --color 888888 --sizes 64
./font-awesome-svg-png.js --color #888888 --sizes 64
I always get black icons. How to specify hex color I want? Please update README with that information.
Use fill="currentColor"
https://github.com/FortAwesome/Font-Awesome/issues/3203#issuecomment-74839177
In addition to setting attributes on objects, you can also use CSS to style fills and strokes. In your CSS, you'll be setting values for attributes like fill and stroke instead of background-color and border... https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Fills_and_Strokes#Using_CSS
<svg class="icon"><use xlink:href="fa-sprites-symbols.svg#fa-facebook" fill="currentColor"/></svg>
Do you mean --fill="#444"
? Or what?
Also I urge the contributors to add that information in README.
https://github.com/encharm/Font-Awesome-SVG-PNG/blob/master/font-awesome-svg-png.js - generates PNG with only two colors: BLACK and WHITE:
'color', "Provide color or colors, e.g. --color black,white"
But if You choose to use SVG sprite, you can colorize seporate symbol with:
- inline
fill
attribute - inherit color from font color (
color
css property)
That's not true. From other issue, there is a way to specify hex color:
font-awesome-svg-png --color "#0370E9" --svg --no-png --dest blue
I just think it should be included in documentation. Also I didn't know that I can control svg color with CSS. Thanks for that. Gotta read through your links when I have time.