Components

Modals

Modals are overlays on top of the interface that interrupt the main flow to focus the user’s attention on specific content. This guide explains their usage.

This guide contains

Usage

Content and interaction

Modals can contain different kinds of information and content. They can simply convey information or be interactive with buttons or icons.

Colors

Modal backgrounds may be formatted with different colors depending on the context and focus. If users need to understand context, it helps to use one of the more transparent backgrounds.