A beautiful, minimalist notification library
// Basic toast
Noti5.toast('This is a simple toast message');
// Type-specific shortcuts
Noti5.success('Operation completed successfully', 'Success');
Noti5.error('Something went wrong', 'Error');
Noti5.warning('Proceed with caution', 'Warning');
Noti5.info('Here is some information', 'Info');
// Position options: 'top-right', 'top-left', 'top-center', 'bottom-right', 'bottom-left', 'bottom-center'
Noti5.toast('Custom position example', 'Position', 'info', 'bottom-left');
// Custom duration in milliseconds (default is 4000ms)
Noti5.toast('Long duration example', 'Duration', 'primary', 'top-right', 10000);
// Manual control
var toastId = Noti5.info('Click X to dismiss', 'Manual', 'top-right', 20000);
Noti5.dismiss(toastId); // Dismiss programmatically
// Basic alert
Noti5.alert('This is a simple alert message');
// Alert with type
Noti5.alert('Your changes have been saved', 'Success', 'success');
// Basic confirmation
Noti5.confirm('Are you sure you want to proceed?', function() {
// Confirm callback
Noti5.success('Action confirmed');
});
// Full confirmation with all options
Noti5.confirm('Delete this item?',
function() {
// Confirm callback
Noti5.success('Item deleted');
},
function() {
// Cancel callback
Noti5.info('Deletion cancelled');
},
'warning', // Type (primary, success, error, warning, info)
'Delete', // Confirm button text
'Cancel' // Cancel button text
);
// Set default position for all toasts
Noti5.config.setPosition('bottom-right');
// Set default duration for all toasts (milliseconds)
Noti5.config.setDuration(8000);
// Customize colors
Noti5.config.setColors({
primary: '#8b5cf6',
success: '#059669',
error: '#dc2626',
warning: '#d97706',
info: '#2563eb'
});
// Chain configuration methods
Noti5.config
.setPosition('top-center')
.setDuration(5000)
.setColors({ primary: '#8b5cf6' });