Skip to main content

Layout Components

Layout components help you organize and control your user interface.

  • Async Content: The Async Content component is a progress indicator that displays an unspecified wait time or length of a process.
  • Card: The Card component is a surface that displays content and actions for a single topic.
  • Container: The Container component centers content horizontally and provides an area to lay out other components to create a unified page design.
  • Footer: The Footer component is a container that allows you to organize other components within it at the bottom of the page.
  • Header: The Header component is a container that allows you to organize other components within it at the top of the page.
  • Menu: The Menu component displays a list of choices on a temporary surface. The user must interact with a button or another control to display a menu.
  • Paper: The Paper component translates the physical properties of paper to the screen. Paper components can be re-sized, shuffled, and bound together as multiple sheets.
  • Popper: The Popper component displays content on top of other content. The component API is an alternative to the react-popper and relies on a 3rd party library, Popper.js, for perfect positioning.