Home

🧈 ButterPop.js Wiki

Welcome to the official wiki for ButterPop.js - a lightweight, highly customizable toast notification library with no dependencies!

Quick Navigation

• Installation Guide
• Getting Started
• API Reference
• Themes Gallery
• Configuration Options
• Examples & Recipes
• Custom Themes
• Contributing

About ButterPop.js

ButterPop.js makes creating beautiful, interactive notifications smooth as butter! With 41 built-in themes, multiple positioning options, progress indicators, and more - all in a lightweight package under 10KB minified.

Key Features

• Zero Dependencies - Pure vanilla JavaScript, no external libraries required
• Lightweight - Under 100KB minified (CSS + JS)
• Multiple Themes - 41 beautiful built-in themes
• Fully Customizable - Easily create your own themes or modify existing ones
• Responsive Design - Looks great on all devices
• Multiple Positions - 7 positioning options for flexible placement
• Progress Indicators - Visual progress bars to show remaining time
• Pause on Hover - Intelligently pauses when users interact with notifications
• Interactive Elements - Support for action buttons and callbacks
• Queue Management - Smart handling of multiple notifications
• Accessibility Focus - ARIA attributes and keyboard navigation support

Quick Example

// Basic usage examples
ButterPop.success('Operation completed successfully! 🎉');
ButterPop.error('An error occurred! ❌');
ButterPop.warning('Warning: This action cannot be undone! ⚠️');
ButterPop.info('Did you know? ButterPop.js is awesome! 💡');

Visit the Getting Started page to learn more!