Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Poor-quality converted glyphs #52

Closed
gmckeown opened this issue Mar 23, 2017 · 5 comments
Closed

Poor-quality converted glyphs #52

gmckeown opened this issue Mar 23, 2017 · 5 comments

Comments

@gmckeown
Copy link

I've been digging into an issue with the quality of icons used in the Seti UI project. It seems that when the SVG font is converted to TTF, the quality of the glyphs is badly affected. This seems most obvious with curves, but doesn't seem limited to them (e.g. the "M" in "ASM" below).

For example, here are some original SVG font glyphs:
svgfont_birdfont

And here's what they look like after conversion to TTF:
svgfont_ttf_birdfont

Command-line used:

svg2ttf seti.svg seti.ttf

Could this be related to issue #25 ?

Original issue against Seti UI: jesseweed/seti-ui#401

@puzrin
Copy link
Member

puzrin commented Mar 23, 2017

Looks like initial dimensions are very small and suffer from rounding. I'd suggest 1000px and more.

  • Could you show your SVG font src? If possible - leave only couple of simple bad images
  • Drop it to fontello and check if generated font is ok or not (it normalizes size)

@gmckeown
Copy link
Author

Full font sources (both the individual SVG images and the generated SVG font) are linked in the original issue above.

Here's a smaller subset. This is created using svgicons2svgfont. They look OK in Fontello.

svgtest_sample.zip

@puzrin
Copy link
Member

puzrin commented Mar 23, 2017

<font-face font-family="svgtest" units-per-em="32" ascent="32" descent="0" />

Problem is in your SVG prepare process. Dimentions should be 1000 and more. I think your tools just take original images as is and don't care about upscale. For example, if you import this font to fontello, result will be good.

@puzrin puzrin closed this as completed Mar 23, 2017
@puzrin
Copy link
Member

puzrin commented Mar 23, 2017

If you decide write manual scaler, that will help https://github.com/fontello/svgpath.

@gmckeown
Copy link
Author

Thank you for your quick and helpful response! I have tested with larger dimensions in the prep process (it uses gulp-iconfont) and it seems to do the job. Have submitted a pull request to the Seti UI project.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants