Why are my labels blurry?

Help
1

Godot Version

4.5.1

Question

Hi everyone. I’ve looked up all over internet, old posts in these forums, even Gwizz made a video about it, why is this a common problem in Godot? I tried many setups (like small scale and huge font size), mipmaps, different import settings for the font, antialiasing, etc… nothing seems to work, it’s so frustrating that the whole text for my game is blurry. As you can see the edges of the letters are blurry, instead of being sharp? What am I missing?
Has anyone encountered this problem? Anyone knows how to definitely fix it for any font?
Thanks!

image
image1092×820 93.1 KB

2

Increase the font size.

1 Like
3

As I said it on my original post, increasing the font doesn’t solve the problem.

4

How are you doing this “font increasing”? Scaling up a label won’t actually increase the font size. In game engines fonts are always rasterized into textures at a specified fixed pixel resolution. Scaling the quads that display text (labels, sprites) won’t increase the texture resolution itself. That’s why you see those pixels. You need to create a new font resource that rasterizes the font at a higher resolution.

5

For labels you can go into Theme Overrides > Font Size in the inspector and increase the size there.

6

It’s ok, I solved it with a shader, it even lets you customize the font to make it thicker or thinner, depending on the look you’re going for. Hope it helps someone going for a pixel perfect font that doesn’t work with the other methods.
Here’s an image of how it looks like, using the very popular pixel art font PressStart2P.ttf. The first one is the original blurry font (no shader), the rest have the shader applied with different alpha tolerance values. I’m sure it can be improved, but it’s good enough for me for now. Thanks.

image
image1038×401 4.22 KB

shader_type canvas_item;

uniform float alpha_threshold : hint_range(0.0, 1.0) = 0.5;

void fragment() {
	if (COLOR.a >= alpha_threshold) {
	    COLOR = vec4(COLOR.r, COLOR.g, COLOR.b, 1.0);
	} else {
	    COLOR = vec4(COLOR.r, COLOR.g, COLOR.b, 0.0);
	}
}
1 Like
7

For pixel fonts simply set the font size to the size the pixel font is nominally made for and set the texture filtering to “nearest”. You don’t need any shaders.

3 Likes