Skip to main content

Popup

Overview​

Popups are container elements for your content that float on the page, and are positioned next to the elements that trigger them. They can be used on their own or to enable other elements.

Use when​

  • You want to provide a definition or extra help to a specific item or term.
  • You want to provide additional context for a component and it involves more than a few words.

Don't use when​

  • You want to show a one to two word label for an icon or element. Use a tooltip instead.

Typically popups are used within other components to help facilitate dropdown lists, floating calendars, or menus for example, but they can be used on their own to display any custom content that you would like.

Components​

The popup is used to enable: