Bootstrap 5 Toasts Color Schemes

Toasts are a type of alert box that is used to show a message or an update to the user. You can use bootstrap 5 color and background utilities to create different color schemes and customize your toasts.

Bootstrap 5 Toasts Color Schemes Classes: We can use the Bootstrap 5 Color classes to color the toast background and Toast texts.

Syntax: 

<div class="toast align-items-center text-* bg-* " >
 ...
</div>

* can be replaced by any color of preference.

Example 1: In this example, we will learn about Toasts Text Color Schemes.

Output:

👁 Image

Example 2: In this example, we will learn about Toasts Background Color Schemes.

Output

👁 Image

Reference: https://getbootstrap.com/docs/5.0/components/toasts/#color-schemes