--- title: Toasts description: Toasts are lightweight alert boxes which display for a few seconds after a user has taken an action, to inform them of the state or outcome. They can be used when a user clicks a button or submits a form and their aim is to provide feedback, rather than encourage to take action. bootstrapLink: components/toasts/ --- ## Default markup Use the default toast message to inform users of the outcome of their action and provide additional information. It contains an `x` close button to make it possible for users to close the toast if they wish. ```html example code ``` ## Translucent Toasts blend over the elements they appear over. If a browser supports the `backdrop-filter` CSS property, the elements under a toast will be blurred. ```html example code ``` ## Stacking toasts Stack multiple toasts together by putting them within one `.toast-container`. ```html example code height="260px"
```