Blurry GUI elements in scene

I am having issues with GUI elements being blurry when in my scene.

To explain my setup, I want to use a Plane that I can move out of camera shot with an image and some text.
The plane is calculated to the exact size it needs to be to fill the camera frame, and is positioned at origin.

for some reason GUI elements, be them images or text are showing quite blurry when rendering

here is a PG showing the blurry text

https://www.babylonjs-playground.com/#HS157N

I’ve recreated as much as I can in the PG but you should be able to see the blurry text in it.

am I doing something wrong with the GUI elements?

Hey! this is because your texture is a bit too small
You can either create a bigger one or rely on renderScale (see line #49):

https://www.babylonjs-playground.com/#HS157N#1

2 Likes

well that was easy, i guess it was foolish of me to assume that the rendering would scale to the size of the texture

Thanks!

2 Likes