Getting TextMeshPro to cooperate with Transparent Materials

Hi All,

Thanks in advance for your time and input!

I’m working on a card game and trying to prototype a card prefab in an empty project that includes:

  • A quad, utilizing a lit shader graph material with render face set to both and surface type set to transparent. I’m using transparent so that I can set an alpha mask to achieve the desired shape.
  • A TextMeshPro - Text component, as a child of the quad, with a local position of (0, 0, -0.0001 to -1) so that it renders in front without z-fighting. I’m using the basic LiberationSans SDF material.

Now the issue I’m facing is that when I use a large z offset like -1, the TextMeshPro component renders fine; when I set an x Euler rotation, the quad correctly occludes the Text mesh as one would expect during the rotation, however, such a large offset is not desirable since the text would clearly be floating in front of the card.

When I set a small offset like 0.001, the TextMeshPro component starts to behave strangely. At an x Euler rotation between 0 and 180 the quad occludes the TMP, and the TMP is shown between 0 and -180, (rather than being visible from -90 to positive 90 as one would expect); you can see it in front of the quad even when the quad is nearly upside down!

I have found that changing the shader graph surface type to opaque also makes the issue go away, however that would leave me without an alpha channel to mask my “card” quad.

The last test I verified was that substituting the TMP component with another quad also works correctly, making me strongly suspect my issue in the TMP component/shader/material.

I’ve taken an advanced graphics class in college and written shader code by hand before, but it’s a highly complex topic and I’m having a hard time figuring out what Unity/TMP are doing here.

My hunch is that there’s something wrong with the ZTest, or something I’m overlooking with my camera since I’m not super familiar with how Unity does things. It’s strange to me how the culling is off by almost exactly 90 degrees when the TextMeshPro is close to the quad, but that it works with a non-transparent material or when I increase the z-offset.

I’ve tried digging around the TMP_SDF.shader to change ZTest to Less, based on what I’ve been seeing on related issues with Google-Fu, but I haven’t been able to figure it out.

I am on v 2021.3.2f1.110 of Unity with TMP v 3.0.6 and using URP on my project. Please let me know if there’s any more information I should provide.

Apologies! I didn’t realize there was a separate TMP subforum. I don’t see an option to close or remove or move this post, but I’m reposting there. Thank you.