Skip to main content

What is image masking

When an image is masked with a layer, a mask object is created in the design hierarchy.
This object includes the mask and the related layers used for masking.
Icons should be designed using vectors, not PNGs.

Best practices for masking

  • All inner layers used for masking should remain under the mask object.
  • Group these inner layers properly so only the intended images are included.
  • Perform masking with a single group containing its masked object.
Masking should always be done with one group that includes the masked object.
Example of image masking in Figma

You did it!

Your masked images are now structured so Rocket can import them cleanly and keep your layout intact.