How to use default svg file fill color

[callmejm]

How to use default svg file fill color ?

When I import the svg as component the fill color it is gone, unless I set fill as a prop value that mention at readme, but i wish it can read from the svg file not manually set.

[kristerkari]

@callmejm This probably depends a lot on the SVG image. Could you please paste the image here so that I can try it out?

[joebochill]

I'm not sure if this is the same issue, but I also recently noticed that my svg icons have been showing up invisible. I believe this was working before (picking up a default color without explicitly setting the fill prop), but I'm still trying to track down when the change might've happened. An example svg that i'm seeing this with is:

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
    <path fill="none" d="M0 0h24v24H0z"/>
    <path d="M12 8.53c-.15.59-.58 2-1.29 4.33h2.61c-.67-2.15-1.05-3.37-1.13-3.66S12 8.7 12 8.53z"/>
    <path d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm2.55 15l-.73-2.38h-3.64L9.45 17H7.17L10.7 7h2.59l3.54 10z"/>
</svg>

My project is using: [email protected] [email protected]

[joebochill]

dropping react-native-svg to 10.1.0 solved my issue, so I don't believe it's an issue in this library 👍

[callmejm]

@kristerkari the svg is take from flaticon.com

[pier-verdu]

same issue :/

[SebinLee]

@joebochill It works thanks!

[sypl]

Yes, it would be really nice to have the default if the prop isn't provided. I'm having to wrap the directly imported SVGs to get around this, which make it... an indirect direct import.