Backdrop

The backdrop component is used to provide emphasis on a particular element or parts of it.

The backdrop signals to the user of a state change within the application and can be used for creating loaders, dialogs and more. In its simplest form, the backdrop component will add a dimmed layer over your application.

Feedback
Bundle size
Sketch
Figma

Example

<Button variant="outlined" onClick={handleToggle}>
  Show backdrop
</Button>
<Backdrop className={classes.backdrop} open={open} onClick={handleClose}>
  <CircularProgress color="inherit" />
</Backdrop>

API

<Backdrop />