[Solved] Pixel art fonts are fuzzy, text / font blury

I’m making a pixel art game and the fonts are fuzzy.

Is there a way to unsmooth? (Like in resources where you can uncheck to “smooth image” - there is no option for fonts.)

I mentioned this somewhere else - I think there should be a global option for smoothing.

Try scaling the font according to the original size.

Every pixel font have an original size (example: 8px). So, when scaling the font do it to a factor of its original size (example: 8px or 16px or 32px or 64px).

2 Likes

Thanks! That helps.

There is still a little anti-alias fuzz, but it’s much better.

JavaScript workaround: After exporting your game, go to the export folder and open the file “Extensions/TextObject/textruntimeobject-pixi-renderer.js”

Approximately at line 37, search this:

style.fontSize = this._object._characterSize;

And replace it with:

style.fontSize = this._object._characterSize * 4; this._text.scale.x = 0.25; this._text.scale.y = 0.25;
(i.e., make the font 4 times bigger, but downscale the text object 4 times)

Hope it helps :slight_smile:

4 Likes

I have noticed the blurry text in my pixel art games too.
@Lizard-13: Are there any drawbacks to this? If no, we could add it to the engine itself. Or maybe as an export option to set the scale/resolution for texts.

That’s GREAT!

1 Like

Thanks! Haven’t tried it yet… but will let you know once I do!

I suggested it, but 4ian wants to be sure there are no betters ways first. This one is not perfect, just an approximation :slight_smile:

2 Likes

I realise I am bringing up an old topic that has been somewhat resolved with bitmap text. I have been working on a game that replaces some of the text with user input text, which as far as I can gather can’t be used with pixel text. I got Lizard-13’s Javascript workaround working well but a few months ago the pixi-renderer extension was changed and the textruntimeobject-pixi-renderer.js file now looks completely different. I tried figuring out where in the jumble to change the Javascript but my knowledge of Javascript is too limited to make any solutions I tried work.

Lizard-13, If you are able please would you help? I would be so grateful if you would put up an updated instruction on setting up the textruntimeobject-pixi-renderer.js to make the workaround work. :slightly_smiling_face:


Can you provide context on what you mean “can’t be used with bitmap text”?

There are events for updating bitmap text objects just like there are for normal text objects, and just like there are for BBtext objects.

Thank you Silver-Streak. Doh! You are right! I don’t know why I didn’t see this. Apologies! I’ll go and experiment with bitmap text!

No worries! Glad I could help. If you run into issues, go ahead and make a new thread and we’ll be glad to help out.

Due to the age of this one it probably should have been closed out by now, so I’m going to do that now.

1 Like