Modal is used to overlay content on top of the interface. They are intended to capture the user’s attention in order to inform or shift focus to a pertinent task.

Modals can be used in various ways such as to confirm important or potentially destructive actions (e.g., deleting a message or upgrading a plan), to provide additional information, and to block user interaction in order to force action on critical tasks (e.g., billing errors, disconnected accounts, service outages, etc…)

Best Practices:

  • An action taken from a modal should not open another subsequent modal
  • Since a modal draws the user’s attention from other tasks and requires an action to be taken in order to close it, consider the user and necessity of the modal.