Why fonts look different on LOVE than on web browser?

[qwdqwqwffqw]

It's nothing really problematic, but I've been wondering why same font(+ same size & same text) looks different on Love, than on web browser, pdf viewer, etc.

The text rendered in love seems to have same heights but narrower width. After several testing, I noticed it's not only letter spacing & kerning, but also thickness of stroke and width/height ratio are slight different(letters like "/" shows noticeable differences in slope angle in stoke), if I'm not mistaken.

Why is it so? Is there any fundamental difference in rendering method?
Since narrowly condensed text can be harmful to readability, is there any way to control this(other than scaling horizontally)?

[dusoft]

Please, post screenshots. AFAIK LOVE uses bitmaps internally for font rendering. Even if you provide TTF, an internal bitmap font will be created from it. This could be the cause.

[slime]

love uses FreeType for truetype text rendering. FreeType has its own rasterization algorithms and default hinting that may behave differently from a specific operating system's own text renderer.

(In fact, text rendered through the OS will look different on each OS.)

That being said, without knowing what your fonts and code are, we can only guess about what you're seeing.

[qwdqwqwffqw]

Oh, sorry for not providing any examples & code.

Here is an example with Segoe UI TTF file(system font. file could be found in C:\Windows\Fonts), but similar difference could be found in other font files including OTF ones.

1. A paragraph from love2d github page(I added "/" for better comparison) in chrome browser :

git1.PNG (11.28 KiB) Viewed 1390 times

which will be rendered with Segoe UI + 16px size in my environment.

git2.PNG (20.34 KiB) Viewed 1390 times

2. Made simple .html with same text, to be sure :

html1.png (17.4 KiB) Viewed 1390 times

3. in notepad2(and other apps) :

notepad1.png (6.7 KiB) Viewed 1390 times

> All above shows same rendering output. You can download images and compare them(they are on the same scale).

4. love, 16px : same height, but narrower output :

love-16.PNG (7.35 KiB) Viewed 1390 times

5. love, 17px : taller, but still narrower ouput :

love-17.PNG (7.78 KiB) Viewed 1390 times

As you can see, rendering of LOVE show more 'condensed' output.

love code used :

Code: Select all

love.graphics.setFont(love.graphics.newFont("segoeui.ttf", 16))
local s = "There/ are also branches for currently released major versions, which may have fixes and changes meant for \nupcoming patch releases within that major version."
function love.draw()
	love.graphics.print(s, 20, 20)
end

[pgimeno]

This looks like if anything, it should be reported to FreeType.

[dusoft]

The difference seems to be in kerning and I would be curious why.