# toast-variant()

The mixin includes an extension class of name prefixed with `toast-` with a given color name that includes a toast variant of the given `$color`.

The mixin includes toast `background` and `border` of a given `$color` CSS variable name.

{% code title="" lineNumbers="true" %}

```scss
@mixin toast-variant(
  $name: 'dark',
  $color: 'dark',
  $font-color: 'light',
) {
  &.toast-#{$name} {
    @include background($color, $alpha: 0.95);
    border-color: color($color);
    // Font color.
    @include color($font-color);
    a:active,
    a:visited,
    a:link {
      @include color($font-color);
    }
  }
}
```

{% endcode %}