Skip to content
Edit this page

Backdrop

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

The overlay 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.

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

API