Theme

ax5toast themes using six colors defined by the bootstrap is provided.
If you want to change the theme to the toast you can define the theme attribute at the time of method calls, you can use to define in advance setConfig.

Toast

<script type="text/javascript">
    $(document.body).ready(function () {
        var toast = new ax5.ui.toast();
        toast.setConfig({
            icon: '<i class="fa fa-bell"></i>',
            containerPosition: "top-right",
            closeIcon: '<i class="fa fa-times"></i>'
        });

        $('button[data-toast]').click(function () {
            var theme = this.getAttribute("data-toast");
            toast.push({
                theme: theme,
                msg: theme + ' color'
            }, function () {
                console.log(this);
            });
        });
    });
</script>

Toast Confirm

<script type="text/javascript">
    $(document.body).ready(function () {
        var toast = new ax5.ui.toast();
        toast.setConfig({
            icon: '<i class="fa fa-bell"></i>',
            containerPosition: "bottom-right",
            closeIcon: '<i class="fa fa-times"></i>'
        });

        $('button[data-toast-confirm]').click(function () {
            var theme = this.getAttribute("data-toast-confirm");
            toast.confirm({
                theme: theme,
                msg: theme + ' color'
            }, function () {
                console.log(this);
            });
        });
    });
</script>