Unmask For UGUI by mob-sakai - 22


Reverse mask for uGUI element in Unity.

Unity 5.5.4p5MIT LicenseUpdated 173 days agoCreated on October 14th, 2018
Go to source


Reverse mask for uGUI element in Unity.

PRs Welcome

<< Description | WebGL Demo | Download | Install | Usage >>

What’s new? See changelog

Do you want to receive notifications for new releases? Watch this repo


Unmask provides the following features:

  1. Reverse mask
  2. Ray through the unmasked rectangle
  3. Following another object
  4. Support nesting
Component Features Screenshot
Unmask Reverse masking for parent Mask component.

Fit Target / Fit On Late Update: Fit graphic’s transform to target transform on LateUpdate.
Only For Children: Unmask affects only for children.
Show Unmask Graphic: Show the graphic that is associated with the unmask render area.
UnmaskRaycastFilter The ray Passes through the unmasked rectangle.
You can click on the unmasked button on the back side.


WebGL Demo



Using UnityPackageManager (for Unity 2018.3+)

Find the manifest.json file in the Packages folder of your project and edit it to look like this:

  "dependencies": {
    "com.coffee.unmask": "https://github.com/mob-sakai/UnmaskForUGUI.git#1.1.3",

To update the package, change #{version} to the target version.
Or, use UpmGitExtension.

Using .unitypackage file (for Unity 5.5+)

Download *.unitypackage from Releases and import the package into your Unity project.
Select Assets > Import Package > Custom Package from the menu.


  1. Add Unmask component to the UI element (Image, RawImage, Text, etc…) under Mask, from Add Component in inspector or Component > UI > Unmask > Unmask menu.
  2. If you want to unmask the area of the button, follow the steps below:
    • Set the button to Fit Target in Unmask component.
    • If the button moves with animation etc., enable Fit On LateUpdate in Unmask component.
    • Add a UnmaskRaycastFilter component to UI element blocking ray.
    • Set the Unmask to Unmask in UnmaskRaycastFilter component.
    • Disable RaycastTarget of the UI elements, as necessary.
  3. Enjoy!
  • Unity 5.5+ (included Unity 2018.x)
  • No other SDK are required

Example of using

Case Description Screenshot
Unmasked text Black screen is cut out with unmasked text.
Hole Black screen is cut out with unmasked Image.
Tutorial button In tutorial, only specific button can be pressed.
Transition Transition effect with silhouette.


  • MIT
  • © UTJ/UCL



See Also

Show all projects by mob-sakai