SVG doesn't import correctly when color is specified on the <svg> or <g> nodes
See original GitHub issueFor example, consider this ic_add_black_24dp.svg
that I downloaded/modified from go/icons:
<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px"
viewBox="0 0 24 24" fill="#ff000000">
<path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" fill="#fffffff"/>
</svg>
AndroidIconAnimator displays a white plus sign path. However, the SVG should really display a black plus sign path.
Issue Analytics
- State:
- Created 7 years ago
- Comments:5 (3 by maintainers)
Top Results From Across the Web
Unable to import svg files in typescript - Stack Overflow
This properly imports the .svg as a string, which is an issue I noticed in the top-rated answer. Update your tsconfig.json with the ......
Read more >Why doesn't my SVG work? - Scan N Cut - Create With Sue
First the reason why these SVG files didn't work properly. The design was interpreted incorrectly and the Fill part of the design imported...
Read more >5 Gotchas You're Gonna Face Getting Inline SVG ... - CSS-Tricks
If your icons generally use only one color, applying CSS styling to a cloned instance in “one sweep” is trivial with: fill: <your-color>...
Read more >Importing svg not working properly - Ask the community
hello, i tried to import an svg by draging it to my draft but it instead it looks like this… what can i...
Read more >How to use SVGs in React | Sanity.io guide
There are a few ways to use an SVG in a React app: Use it as a regular image; Import it as a...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
BTW, the easiest solution to this I think is to just use svgo. There is an option to move parent attrs to the children nodes. I’m using it in ShapeShifter right now. 😃
In the meantime, you could fork that pull request and run svgo on your Adobe Illustrator SVGs yourself. I’ve been doing that at least… and for the most part it has been cleaning them up great. Not sure what is taking the pull request so long to get merged into master… 😕