# UIEffect for Unity: Grayscale, Blur and Dissolve Effects from the Inspector

> UIEffect is an MIT-licensed Unity package that applies filters such as grayscale, blur and dissolve to uGUI and TextMeshPro elements. It installs through OpenUPM or UPM and needs Unity 2020.3 or later.

**mob-sakai/UIEffect** — UIEffect is an open-source package that allows you to intuitively apply rich UI effects directly from the Inspector or via code. Combine various filters, such as grayscale, blur, and dissolve, to decorate your UI with a unique visual style!

- Repository: https://github.com/mob-sakai/UIEffect
- Website: https://mob-sakai.github.io/UIEffect/
- Stars: 7,676 · Forks: 954
- Language: C#
- License: MIT
- Published: 2026-09-22 · Updated: 2026-09-22 · Language: en
- Canonical page: https://hysenlabs.com/projects/mob-sakai-uieffect

## The gap UIEffect fills between uGUI and hand-written shaders

A Unity UI screen that needs to grey out a disabled button, blur a panel behind a dialog, or dissolve a card away normally means writing a shader, wiring material properties, and keeping that material in sync with the Image or TextMeshPro component it decorates. UIEffect packages that work as components you attach to existing UI elements. The README describes the target audience plainly: game developers, UI designers, and anyone looking to enhance Unity UI with minimal effort. The practical consequence is that a designer can adjust a filter in the Inspector without a code change, and a programmer can drive the same parameters from script when the effect is dynamic. The package is not a general-purpose post-processing stack. It is scoped to UI, and the component sits on the same GameObject as the graphic it modifies.

## How the filters, tweener and replica components fit together

Three components carry most of the design. UIEffect is the main one and holds the filter parameters. The README groups those parameters into tone filter, color filter, sampling filter, transition filter, detail filter, flip, and further modes including target mode, blend type, shadow mode, gradation mode and edge mode. Each group maps to a family of visual results: tone and color cover grayscale, sepia and HSV-style shifts; sampling covers blur and pixelation; transition covers dissolve and melt-style reveals. UIEffectTweener is a separate component that plays, stops, pauses and resumes effects, and the README also states that AnimationClip control is supported, so effect animation can live in an animation track rather than in code. UIEffectReplica duplicates effects and applies them to multiple UI elements at once, which is how you avoid configuring the same filter on twenty separate objects. The README lists optional integrations with TextMeshPro, SoftMaskForUGUI, ShaderGraph and Timeline, plus URP, HDRP and VR support, and states that only the shader variants in use are built. That last point is a build-time property rather than a rendering one, and it is the kind of claim worth confirming against your own build log rather than taking on faith.

## Installing UIEffect and applying your first filter

The README states the package requires Unity 2020.3 or later and calls OpenUPM the preferred installation method, because updates arrive as they are released. With openupm-cli installed, run the add command in your project directory.

```bash
openupm add com.coffee.ui-effect
```

The package name is com.coffee.ui-effect. The README also documents installing through the Package Manager UI and installing manually via UPM, so the OpenUPM route is a convenience rather than the only path. After installation the README points to an Import Additional Resources step; if the components appear but effects render without their supporting assets, that step is the one to revisit. For a first real use, select a GameObject that already has an Image or TextMeshPro component, add the UIEffect component, and set the tone filter to grayscale. The README's usage section walks through the component, the tone filter and the remaining filter groups in that order, so the Inspector layout follows the documentation. The repository also ships a WebGL demo linked from the README, which is the fastest way to see the effect catalogue before installing anything.

## Version 5 is the documented API, and v4 compatibility is opt-in

The README opens with a warning that it covers v5 and links to a separate branch for v4. Existing projects built against v4 components will not find their API described here. The package does ship v4 compatible components, but the README labels them optional and frames them as a way to upgrade with minimal changes. That framing is honest about the trade-off: keeping the compatibility layer means carrying two component models, while dropping it means touching every prefab and scene that references the old components. The release history shows the package is still moving, with 5.11.7 published on 2026-08-27 and 5.11.6 and 5.11.5 before it, so the v5 line is the one receiving changes. A team on v4 should treat the compatibility components as a migration aid with a defined end date, not as a permanent resting place.

## Where UIEffect is the wrong tool

UIEffect targets UI graphics. If the effect you want belongs on a world-space mesh, a particle system, or a full-screen camera pass, this package is not the mechanism for it, and the README's scope gives no indication otherwise. The shader variant claim cuts the other way too: because only variants in use are built, a screen that enables many filter combinations at runtime can pull in more variants than a build configured around a fixed set of effects. Projects that generate effects procedurally across the whole filter matrix should measure their build output rather than assume the variant stripping covers every combination. There is also a coupling cost. Every UI element that carries a UIEffect component is tied to this package's shader pipeline, so removing it later means revisiting those prefabs. Teams that already maintain their own UI shader library may find the component model duplicates work they have already done.

## UIEffect against writing a custom UI shader

The real alternative is a hand-written shader with a material per effect, which is what many Unity teams do before reaching for a package. The difference is where the parameters live. A custom shader puts them on a Material asset and in shader properties; UIEffect puts them on a component in the Inspector next to the Image or TextMeshPro it affects, and exposes them to script, AnimationClip, and Timeline. The custom route gives complete control over the math and no third-party dependency in the build. The UIEffect route gives a catalogue of effects that already work together, which matters when you need grayscale plus blur plus dissolve on the same element and do not want to write the combination logic yourself. Neither is strictly better. A studio with one bespoke effect and an existing shader pipeline gains little from the package; a studio that keeps asking for one more filter on a shipping UI gains a lot.

## Licence, maintenance and the cost of upgrading

UIEffect is MIT licensed, which permits commercial use and modification provided the licence and copyright notice are retained. That notice lives in LICENSE.md at the repository root, and any fork or vendored copy needs to carry it. The repository is not archived, and the last push was on 2026-08-27, so the project is receiving changes. Release cadence over the three most recent versions spans roughly five weeks, which suggests maintenance rather than a frozen codebase. The upgrade cost is concentrated in the v4 to v5 transition: the README devotes a dedicated section to it, and the compatible components exist precisely because that move is not free. There is no rollback procedure documented in the README, so a team that upgrades and hits problems should plan to revert through version control rather than through a package-provided downgrade path.

## Conclusion

Adopt UIEffect when your team already ships uGUI or TextMeshPro screens and wants filters such as grayscale and dissolve tuned in the Inspector rather than hand-written shaders. Skip it if you need effects on non-UI renderers, or if you are not ready to move off the v4 component API, since v5 is the version this README documents. Before committing, verify three things in your own project: that your Unity version is 2020.3 or later, that the shader variants your screens use are the ones actually built, and how TextMeshPro font and sprite tags behave under the filters you enable.

## FAQ

### What is UIEffect in Unity?

UIEffect is an open-source Unity package that applies visual filters such as grayscale, blur and dissolve to UI elements. The README describes it as a way to decorate UI by combining multiple filters and parameters directly from the Inspector or via code.

### How do I install UIEffect?

The README calls OpenUPM the preferred method and gives the command openupm add com.coffee.ui-effect, run in your project directory with openupm-cli installed. It also documents installing through the Package Manager UI and manually via UPM.

### Which Unity versions does UIEffect support?

The README states the package requires Unity 2020.3 or later, and the badges list Unity 2020.3+ and Unity 6000.0+. It also lists TextMeshPro, ShaderGraph, Timeline, URP/HDRP and VR support.

### Does UIEffect work with TextMeshPro?

Yes. The README lists TextMeshPro support as a key feature and notes that it covers the font and sprite tags, and there is a dedicated usage section for it.

### Can I keep using the v4 UIEffect components after upgrading?

The README says v4 compatible components are available optionally, for upgrading with minimal changes, but the README itself documents v5 and links to a separate branch for v4.

### What licence does UIEffect use?

The repository lists an MIT licence, with the licence file at LICENSE.md in the repository root.

## Sources

- [License: MIT](https://github.com/mob-sakai/UIEffect/blob/main/LICENSE)
- [mob-sakai/UIEffect on GitHub](https://github.com/mob-sakai/UIEffect)
- [Project website](https://mob-sakai.github.io/UIEffect/)
- [README](https://github.com/mob-sakai/UIEffect/blob/main/README.md)
- [Releases](https://github.com/mob-sakai/UIEffect/releases)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/mob-sakai-uieffect