Tailwind Alert

A simple, dependency-free, and customizable alert modal built using Tailwind CSS and vanilla JavaScript.

Features

• 🧩 Easy to integrate
• 🎨 Styled with Tailwind CSS
• 📦 No external dependencies
• ✅ Custom titles, messages, and alert types
• 🔄 Confirm and Cancel callbacks

Demo

Installation

1. Include the script in your HTML:

   <script src="TailwindAlert.js"></script>
   

2. Make sure Tailwind CSS is included in your project:

    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
   

3. Trigger the alert using JavaScript:

   TailwindAlert.show({
     title: "Delete Item",
     message: "Are you sure you want to delete this?",
     type: "warning",
     onConfirm: () => alert("Confirmed!"),
     onCancel: () => alert("Cancelled!")
   });
   

API

TailwindAlert.show(options)

Customization

You can edit the styling directly in the TailwindAlert.js file to match your theme or branding.

License

MIT License

Author

Created by [Your Name]. Contributions are welcome!