I want to easily chang the color of the icon in Sweealert2, but I get unknown parameter in console

Question

I am following the documentation and it is working wonders. However, using the iconColor property I get this error in the console: SweetAlert2: Unknown parameter "iconColor". How can I easily change the color of the icon? I could change the color using customClass, but I would prefer to use iconColor as shown in the documentation.

Javascript:

function Delete(e) {
            swal.fire({
                title: "Do you want to delete?",
                text: " You will not be able to undo after deletion",
                icon: "warning",
                iconColor: "#000",
                showCancelButton: true,
                focusCancel: true,
                confirmButtonColor: '#d33',
                confirmButtonText: 'Yes, delete!',
                cancelButtonColor: '#3085d6',
                cancelButtonText: 'Cancel',
            }).then((result) => {
                if (result.isConfirmed) {
                    e.previousElementSibling.click();
                }
            });
        }

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/sweetalert2.min.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/sweetalert2.all.min.js"></script>
<button onclick="Delete(this)" type="button" class="btn btn-sm btn-danger mt-2">Delete</button>

Concerto

codepen.io/swarajgk/pen/vYXGgPR Yup, same, working for me too – Belay

Answer 1

iconColor works for me when trying it in CodePen - It appears this was added in SweetAlert2 10.1.10 (https://github.com/sweetalert2/sweetalert2/pull/2052), and made an updatable param in 10.2.0 (https://github.com/sweetalert2/sweetalert2/issues/2053)

Are you running a version of sweetalert2 later than these? :)

Mariquilla

Thank you! I made a dummy mistake of grabbing the v9.17.2 version, assuming the latest version would be displayed on jsdelivr.. (got the files from "top 5 files") – Concerto

Answer 2

You can check the version of sweet alert CDN library link which you are using.

You can user the below link and it is working fine when setting the iconColor property to any color code.

Link:

JavaScript Code:

Swal.fire({
   title: "Do you want to delete?",
   text: " You will not be able to undo after deletion",
   icon: 'warning',
   iconColor: "teal",
   showCancelButton: true,
   confirmButtonText: 'Yes',
   }).then((result) => {
       if (result.isConfirmed) {
             e.previousElementSibling.click();
       }
});

Sixpenny