An overlay on a webpage is a UI element that appears on the top of the page. This is placed on the website to provide additional information or instructions to the user to help them act. These overlays come in different forms. They can be a window, a pop-up, or even a tooltip.
The overlays are used to avoid too much information on the webpages so the page looks neat and not cluttered. When they appear on the screen, they provide the user with inputs and next steps so their journey does not break and the user engagement continues.