Scaling down custom font characters adds white background to character

I created an SVG with a transparent background in Illustrator. I then created a font with this SVG to do some testing.

I imported the font to Unity and generated a SDF font that will work with TMP.

When I use the character at a large scale, it works perfectly, however, when I scale it down this happens:



That white background is not supposed to be there, what is causing this? The background matches whatever color I give the font.

 

This visual artifact is the result of the Ratio of Sampling Point Size to Padding being too small.

2. I see visual artifacts around the edges of characters. How do I get rid of them?
These artifacts can be caused by material properties like Dilation, Outline, Underlay, etc. As these property values get near their maximum range, parts of adjacent characters in the font atlas texture can bleed into each other. The font Asset Creator inserts padding between characters to prevent this from happening. To make these visual artifacts go away, re-create the Font Asset with a larger padding value. Note that the padding value affects the range of those properties but also affects the sampling quality of the Font Asset. See this topic for more details. See the following updated video about Font Asset Creation which provides information about padding and how it affects material properties and their range.

The solution is simple, increase the Ratio of Sampling Point Size to Padding. Typically you want to aim for about 10% ratio. As such if the Sampling Point size is 90 then a padding value of 9 is good for normal usage.

The following information is also useful here...

11. How can I increase the range of text effects like dilation, outline, and underlay?
The range of these effects is determined by the padding used when creating the font atlas. The larger the padding, the larger the effect range. Of course more padding means less room for character data. So there is a trade-off between character quality and effect range. Use the smallest padding that works for you. Note that the padding is specified in pixels, so if you double the texture size you also have to double the padding to keep the same range. See here and here for more details. See the following updated video about Font Asset Creation which provides information about padding and how it affects material properties and their range.