SDF Image - Quality UI Outlines and Shadow

Adds additional import settings for textures for SDF (Signed Distance Field) import which used in custom UI shader to render surface-correct outline/shadow/underlay around an Image. To render Image with outline/shadow use component SDFImage, provide it with sprite and optional SDF material to adjust outline properties.



👁️Web samples documentation👁️ (Samples available in package manager)


🚀Play WebGL Demo🚀


▶️Watch tutorials playlist▶️


Requires Unity 2021/2022 or higher.


Versions before 1.1.x is not directly compatible with 1.1.x, know more about it here


If you updating to version 1.1.10 or higher from older one you should make clear installation, guide how to do clear install is here



🟩Features🟩

  • Perfomant - all data to generate outline is cached and sotred as nested texture in original texture asset, avoiding runtime calculation.
  • Crisp - due to SDF rendering nature no matter how zoomed otuline, it will always remain crips, not pixelated.
  • All image modes supported - Simple, Sliced, Tiled, Filled, all modes are supported.
  • Multiple sprites support - sprites with 'Multiple' mode is fully supported.
  • Seamless integration - its just a few clicks to setup your initial Outline/Shadow. User experience integrates nativly to unity.
  • Mask support - can be both masked and act as mask.
  • Pixel art support - pixel art is fully supported, it requires some preparations
  • Atlas support - for most part is supported, tho require some additional setup

🛣️Roadmap🛣️

  • Improving image modes support (Tiled, Sliced, Filled), right now there are certain nuances
  • Possibly adding Sprite Renderer support
  • Advanced materials, textures, animations, virtual materials, etc