Overlays

  • An Overlay is a link type that lets you display another Artboard on top of the existing one rather than navigating to the new Artboard.
  • Overlays can be used for modal windows, drop-down menus, pop-up notifications, all without leaving your current screen.

Creating an Overlay is as easy as creating two links:

  1. Select the Layer that will trigger the Overlay 
  2. With Links , connect it to the Overlay artboard
  3. Check the Overlay box in Links
  4. Now, select the Overlay component and link it to the “Dismiss Overlay“ option at the top menu bar
  5. Change the Overlay artboard background color to transparent by moving the transparency slide to the left. Make sure that “Include in export“ is checked in

[Download] this High-Fidelity Prototype Sketch file to try it yourself.


ℹ️ Overlay Tips:

  • For a cooler Overlay effect, set its artboard background color to 70% Transparent

Learn More

Get started with these tutorials: 

We’re super excited to have you trying it out and hearing your feedback.

Did this answer your question?