Types of overlays
Tooltips
Tooltips display additional hidden information. Revealed upon the click or hover of a UI element.
Toogletip
Toggletips display additional hidden information. Revealed upon the click or hover of a UI element, and can contain interactive elements.
Popover
Popovers are typically used to provide supplementary information, explanations, or actions related to a specific element within the user interface. They are context-specific and often appear near the element they are associated with.
Toast
Toasts should communicate information about the status of an application’s process, like confirmation that a task has been successfully submitted. They are low-emphasis and meant to be temporary, but can also be dismissed manually with a Close Button.
Popup
Pop-ups are more disruptive and may demand immediate attention, often serving purposes beyond the current user context and potentially limiting user control and multitasking. (modal/non-modal)
Dialog (non modal)
Dialog components are in-context elements allowing users to interact within a specific section without disrupting the main interface flow. Task and process related. (bottom sheet candidate) Could be modal.
Modal
Modals are overlays that demand the users' immediate attention for critical information or confirmation.
Decision tree
A decision tree for when you need some guidance on what type of navigation element, that would make sense to use.