Which type of image is better to use in the Unity UI Toolkit?

Unity Engine
, ,
1

Hello. Can you please tell me which type of image is better to use in Unity UI Toolkit - Texture, Sprite, or Vector? The main thing for me is to have a clear image. I am designing interfaces in the base resolution of 360x640, and, for example, I have an image size of 80x80. How should I use it?

  • Export it from Figma in SVG format, convert it to UI Toolkit Vector Image, and insert it into UXML as Vector.
  • Export it from Figma in PNG format with some scale (which one? x4?), convert it to UI Sprite, and insert it into UXML as Texture/Sprite.
  • Your suggestion?
2

As far as I am informed (anyone feel free to correct me if this is wrong/outdated) you would nowadays generally want an sdf or vector solution for UI. Sadly UIToolkit supports neither of those in a sufficient manner. Sdf isn’t supported at all as far as I know. There is a unity vector preview package available since 6 years (also pinned in this forum), but it seems to have a very low development priority paired with a long list of limitations and restrictions (anti-aliasing and animations to name two of the bigger ones) which means it is only usable in a hybrid approach at best (and won’t actually give you some of the advantages you’d usually expect from using vector graphics).

So if you use UIToolkit it will likely be regular png sprites or similar for the foreseeable future (maybe sprinkled with a handful of vector images for exploration or specific use cases).

If you aren’t set on UIToolkit there are several sdf solutions available in the asset store, as well as UI frameworks that support vector graphics (noesis for example).

1 Like