🍞 GA Toasts

Modern, accessible, dependency-free toast notifications for the web. Configure one live in the playground below β€” the code writes itself.

Zero dependencies ~11.5 KB gzip TypeScript WCAG AA Dark mode Β· RTL MIT
Install from npm β˜… GitHub Documentation

Getting started

Three lines to your first toast

Install, import, and call β€” no config or CSS wiring. It just works.

1

Install

npm install ga-toasts
2

Import

import { toast } from 'ga-toasts'
3

Toast anywhere

toast.success('Saved!')

Playground

Build a toast, copy the code

Tweak the controls and the snippet writes itself. Switch to the Theme tab to restyle every toast with toast.theme().

playground.js 

              

              
              
              
πŸ’‘ The code updates live as you tweak the controls. Hit Fire toast to preview it β€” or open the Theme tab and a live preview appears automatically.

            

          

        


        

          

            
Recipes

            
Higher-level helpers

            
One-liners for the patterns you reach for most β€” promises, confirmations, and live updates.

          

          

        


        

          

            
Why GA Toasts

            
Small, accessible, and yours to theme

            
Everything you need, nothing you don't β€” configurable down to the design token.

          

          

            
πŸ“¦
Zero dependencies
One small file, ~11.5 KB gzipped. No framework, no jQuery, no runtime deps.

            
β™Ώ
Accessible by default
WCAG AA contrast, ARIA live regions, focus management, and a modal confirm().

            
πŸŒ—
Dark mode & RTL
Automatic light/dark theming with design tokens, plus full right-to-left support.

            
πŸ‘†
Swipe to dismiss
Pointer/touch swipe, pause-on-hover, and a smooth stacked, fan-out-on-hover layout.

            
🧩
Batteries included
promise(), confirm(), custom content, actions, avatars, and update-in-place.

            
πŸ”·
First-class TypeScript
Fully typed API, ESM + CJS + CDN builds, and generated .d.ts declarations.

          

        


        

          

            
FAQ

            
Frequently asked questions

          

          

            

              What is GA Toasts?
              
GA Toasts is a modern, lightweight JavaScript library for creating beautiful toast notifications in web applications. It features 7 toast types, 9 positioning options, 8 animation effects, and 3 theme variants with full accessibility support.

            

            

              How do I install GA Toasts?
              
Include the stylesheet and the script in your HTML, or install it from npm. It has zero dependencies β€” no jQuery or framework required β€” and is lightweight and optimized for performance.

            

            

              Is GA Toasts accessible?
              
Yes, GA Toasts is built with accessibility in mind, supporting screen readers, keyboard navigation, and ARIA attributes for better user experience across all devices.

            

            

              Can I customize the appearance of toasts?
              
Absolutely! GA Toasts offers extensive customization options including CSS variables, multiple variants (filled, light, default), different sizes, custom icons, and theme support for light/dark modes.