How to set up crisp TTF/OTF pixel font rendering with TextMesh Pro

Hope this isn’t a redundant post, but a quick search didn’t turn up a good answer. I recently had to set up a bitmap TTF font in TextMesh Pro. I had to spend a few minutes playing around with it to get it crisp. I’m posting my steps here so I can find them again if I need them later. If I missed steps or someone wants to add corrections or clarifications, please do.

I’ll go through the steps with Public Pixel Font (dafont.com).

  1. Drop the TTF into your Unity project.

  2. Determine the bitmap size – in the case of Public Pixel Font, it’s 8 px.

  3. Set the Font Size to match, and set Rendering Mode to Hinted Raster. No need to change the other settings. Click Apply.

  1. Right-click on the font and select Create > TextMesh Pro > Font Asset. This will create an SDF file.

  2. Expand the SDF:

9830745--1413852--upload_2024-5-12_20-59-23.png

  1. Inspect the Atlas subasset. Set Wrap Mode to Clamp and Filter Mode to Point:

  1. Inspect the Atlas Material. Change the shader to TextMeshPro > Bitmap:

  1. Inspect the SDF and click Update Atlas Texture:

4 Likes
  1. This will open the Font Asset Creator window. Set the Sampling Point Size to the bitmap font size, and set Render Mode to RASTER or RASTER_HINTED. I chose the Extended ASCII Character Set below. Then click Generate Font Asset.

  1. Create TextMeshPro / TextMeshProUGUI elements in your scenes. Set the Font Size to multiples of the bitmap size (e.g., for 8 px, use 8, 16, 32, etc.). Below is the font rendered at Font Size 8, then blown up in Photoshop so you can see that the edges are crisp.

Crispness will also depend on your canvas settings, but that’s not specific to TextMesh Pro.

5 Likes

This was the only thing that helped my issue - thanks TonyLi!

1 Like

I’ve been trying to fix this problem for WEEKS now. You are a god-send. I love you.

Glad those steps could help!

Exactly what I was looking for after searching for hours. Thank you!