Outline color forming as squares

Hello! I have a TextMeshPro set as:
FaceDilate 1
OutlineWidth 1

Which should give me this
7568377--936982--upload_2021-10-13_10-35-10.png

However whenever I’m starting the game (from UnityEditor) I get this weird border:
7568377--936979--upload_2021-10-13_10-33-30.png

The weirdest part is that, by simply accessing the shader material and clicking on any values (for instance, I simply drag the Dilate slider from 1.0 to 0.9 back to 1.0), it fixes that artifact issue on every instance of the material. I’d assume it could be Camera related?

These visual artifacts are the result of using material property values near or at their maximum range where we end up into the adjacent glyph in the atlas texture. This is expected behavior as the SDF Data is spread over the padding so pass that point we no longer have valid distance data and you end up with a solid block per character.

Since material property values are normalized, the effective range of material properties is determined by the sampling point size to padding ratio. Increasing this ratio will give you more range for those properties like Dilation, Outline, etc. where to get the same visual range, you will no longer have to use values near the maximum value of 1.0.

Whenever you tweak material property values and end up pushing these values nears their max, this is a sign that your sampling point size to padding ratio is too small. A good range to target by default is 10%. So if the sampling point size of the font asset is 90 then padding should be 9 for 10%. This give you a descent range.

There are numerous posts about this on the forum with additional information. Sampling Point Size to Padding Ratio is also very important for fallback font assets.