I try to make custom icons for an app. I use Illustrator to create compound paths. Therefore I use FontAwesome-Pro.5.13.0 icons. When I export my custom icons in SVG format they seem to have a different padding (see the picture below). Left is the exported icon which has the same compound path as the right one. The only difference is that I exported the FontAwesome to svg.
Anyone got an idea what's happening?
Related
I made a logo from SVG, and it looks and works fine. The only problem is that when I go into dev tools and then use the select an element tool, it also shows the elements inside of the SVG image as separate elements, rather than the SVG being A single element. I am using an embed tag so the custom font loads. Is there a way to make the SVG show as one image rather than many elements? Thank you!
If I export a shape with drop shadow as SVG, the drop shadow get's rasterized. Why?
The <feDropShadow> filter works great! I don't want ugly rasters in my clean sharp SVGs. Rasters are evil. :(
Even when importing (e.g. this SVG) Illustrator ignores the filters.
Is there a way to force Illustrator to use a filter for the shadow without drawing the shadow by myself?
There is a way
All you need to do, is use svg-filters specifically when you want to work with svg.
Click Add New Effect/SVG Filters/Apply SVG Filter
Then you can select shadow presets (or use a gaussian blur to create the shadow yourself), then click on the fx button, then you can edit the actual code the svg will make and finally click on update preview to see the changes you have made.
I don't know why adobe doesn't create a UI for this method, but you can just change the properties yourself to get the desired look you need.
I am unable to answer your question directly, however, I can suggest a solution -- use Inkscape (it's free).
Apparently, Illustrator does not fully support SVG filters.
With Inkscape, all you have to do to add a drop shadow once you open your SVG file is to select the object that you want to add a drop shadow to and then in the top bar you've got Filters -> Shadows and Glows -> Drop Shadow.
Hope it's helpful.
Does anybody know if SVG iconsets are working as of the current version? (1.0.7)
I'm strugling to use some custom svg with the md-icon directive but I haven't managed to see anything on the screen. Is there something broken or it's simply not implemented?
Any example of how to create and use an svg iconset file?
I know I can use the md-svg-src attribute to load one specific svg file providing its url, but that forces me to have all svgs on separated files and it also doesn't play well with the template cache.
Note: I'm using SVGs for the icons, not an icon font.
I am trying to create a simple SVG icon (composite path) using Adobe Fireworks.
Icon shall comprise of a circle with an alphabet in its centre.
The background of circle is supposed to be transparent but that of that should be would be the outline color of circle.
When i am trying to merge both elements as composite path using Join then the text fill is lost.
Icon is supposed to be a Single Composite Path only as it is then required to be imported in my Javafx application.
I am attaching both expected icon and current icon being created for understanding issue
Any possible solution for same would be really helpful
Thanks in advance
Would like to take my logo made in illustrator then turn it into a svg so that i can then use Raphael to animate it. I know how to make a simple image by creating my own path using lineTo.
Didn't know if this is possible or not.
Thank you
Once you save your logo created with Illustrator as svg file, there is a way to convert the SVG into a Raphael object and then you can use it with Raphael library.
Chack out this website: http://irunmywebsite.com/raphael/SVGTOHTML_LIVE.php
If you can, open the page with Firefox. Chrome messes up the page. Good Luck.
Well, if its just the path you need without the colors, stroke widths etc, i would save the illustrator logo as an SVG and then open it with a text editor(say Notepad).
From there i would extract the d attribute as a path and manually add the rest of its ''features'' like colors,stroke widths etc.