I have an svg which when opened in any browser comes up fine. I am trying to convert a bunch of them to font icons using http://icomoon.io/ but it's not coming up correctly after importing. I tried using http://fontastic.me/ as well but no luck.
Here is the SVG Image markup -
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" width="400px" height="400px" viewBox="0 0 400 400" enable-background="new 0 0 400 400" xml:space="preserve" style="
color: red;
">
<path fill="none" stroke="#231F20" stroke-width="15" stroke-miterlimit="10" d="M323.41,321.664c0,0.457-0.371,0.828-0.828,0.828 H88.835c-0.458,0-0.829-0.371-0.829-0.828V87.918c0-0.459,0.371-0.829,0.829-0.829h233.747c0.457,0,0.828,0.37,0.828,0.829V321.664z " style="
color: red;
"/>
<path fill="none" stroke="#231F20" stroke-width="15" stroke-miterlimit="10" d="M215.311,196.935"/>
<path fill="none" stroke="#231F20" stroke-width="15" stroke-miterlimit="10" d="M250.935,277.399 c25.36-14.769,42.409-42.247,42.409-73.71c0-47.078-38.164-85.242-85.242-85.242s-85.242,38.164-85.242,85.242 c0,31.463,17.048,58.941,42.408,73.71"/>
<g>
<path fill="#231F20" d="M173.653,282.14l-4.741-48.439c-0.059-0.58-0.327-1.092-0.715-1.482l-47.088,54.471 c0.48,0.449,1.127,0.714,1.82,0.676l48.578-2.721C172.82,284.568,173.783,283.448,173.653,282.14z"/>
</g>
<text transform="matrix(1 0 0 1 175.665 231.1914)" fill="#231F20" stroke="#231F20" stroke-width="2" stroke-miterlimit="10" font-family="'Helvetica'" font-size="99.4919">A</text>
</svg>
I am guessing that it has something to do with how the image was created but can't find much resources on how to resolve the issue. Any help would be awesome!
Thanks.
IcoMoon will ignore stroke attributes and text objects. It is only interested in filled shapes. In your case, that means it will only import the triangle at the end of the circular curve.
You need to convert your paths and text into filled shapes. In Inkscape, try selecting your artwork and pressing CtrlShiftC. In Illustrator, there's an Outline Stroke option somewhere in the Path menu, and the command for converting text to outlines is, if I recall correctly, āShiftC on a Mac (probably ControlShiftC otherwise).
If you have any overlapping objects, they will probably have to be merged together too.
And don't expect perfect results. IcoMoon does a reasonable job, but it may convert curves into straight lines in some situations.