About UIFX - Drop Shadow Filter
Overview
What?
UIFX-DropShadowFilter is a new visual effect for Unity's UI (uGUI) components that applies a drop shadow filter of the component.
Why?
Unity's UI system currently doesn't have an option to render UI elements with a high quality shadow.
Drop shadow is a very useful effect, especially for text.
How?
Just add the UIFX-DropShadowFilter component to your UI component. That's it!
Features
- High quality shadow rendering
- TextMeshPro supported
- Easy to use
- Highly optimised
- Cross-platform
- Built-in/URP/HDRP
- Source code included
- Well documented & supported
- Also works in editor (no need to enter play mode)
Usage
Some example use cases:
- Interactive
- Inset
- Under Glow
Compatibility
| Unity Version | 6.x | 2023.x | 2022.x | 2021.x | 2020.x | 2019.x | 2018.x | 2017.x |
|---|---|---|---|---|---|---|---|---|
| Supported | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✗ | ✗ |
| Platform | Windows/UWP | macOS | Linux | Android | iOS / tvOS | WebGL | PS4 / PS5 | XBox One |
|---|---|---|---|---|---|---|---|---|
| Supported | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Render Pipeline | Built-in | URP | HDRP |
|---|---|---|---|
| Supported | ✓ | ✓ | ✓ |
Dependencies
This plugin requires the Unity.UI package that is included with Unity by default.
Supported Features
| UI Feature | Supported | Notes |
|---|---|---|
| Components: | ||
| Text | ✓ | |
| TextMeshPro | ✓ | |
| Image | ✓ | |
| RawImage | ✓ | |
| Mask | ✓ | |
| Rect Mask 2D | ✓ | |
| CanvasGroup | ✓ | |
| Custom | ✓ | |
| Canvas Render Modes: | ||
| Screen-Space Overlay | ✓ | |
| Screen-Space Camera | ✓ | |
| World Space | X | |
| Render Pipelines: | ||
| Built-in | ✓ | |
| URP | ✓ | |
| HDRP | ✓ | |
| Colorspaces: | ||
| Gamma | ✓ | |
| Linear | ✓ |
Advanced
Performance
UIFX-DropShadowFilter has had several optimisation passes, so we can say with confidence that it is highly performant. Once the shadow has been computed it simply rendered as a texture so the effect is very fast. Changing properties of the component, the Graphic or the parent hierarchy will result in the shadow being recalcuated which can be expensive when the Blur property is too high.
Garbage Collection
This component has been optimised to reduce garbage generation.