A simple, beautiful, responsive drop-in replacement for JavaScript's
boring
alert(). One function call, zero dependencies.
Why upgrade?
alert('Hello World!');
alertbox.render({
alertIcon: 'success',
title: 'Thank You!',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
themeColor: '#7C6FFF',
btnColor: '#C6FF4E',
border: true
});
Screenshots
Alert Types
Five built-in icon types to match every situation.
alertbox.render({
alertIcon: 'success',
title: 'Thank You!',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
border: true
});
alertbox.render({
alertIcon: 'error',
title: 'Oops!',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
border: true
});
alertbox.render({
alertIcon: 'warning',
title: 'Careful!',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
border: true
});
alertbox.render({
alertIcon: 'info',
title: 'Info',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
border: true
});
alertbox.render({
alertIcon: 'question',
title: 'Are you sure?',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
border: true
});
Documentation
Three steps — done in under a minute.
Add this <script> tag to
your HTML footer
<script src="https://cdn.jsdelivr.net/gh/noumanqamar450/alertbox@main/version/1.0.2/alertbox.min.js"></script>
Basic AlertBox function call
alertbox.render({
alertIcon: 'question',
title: 'Thank You!',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
themeColor: '#000000',
btnColor: '#7CFC00',
border: true
});
Custom theme colour
alertbox.render({
alertIcon: 'success',
title: 'Thank You!',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
themeColor: '#000000'
});
Custom button colour
alertbox.render({
alertIcon: 'success',
title: 'Thank You!',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
themeColor: '#000000',
btnColor: '#7CFC00'
});
Enable border (default is false)
alertbox.render({
alertIcon: 'success',
title: 'Thank You!',
message: 'AlertBox Popup Message',
btnTitle: 'Ok',
themeColor: '#000000',
btnColor: '#7CFC00',
border: true
});
Open Source
Has AlertBox helped you build something amazing? Show your support with a small donation — it keeps this project alive and growing.
Buy Me A Book