This tool helps developers test Web Push and local notifications directly in the browser. You can customize notification parameters (title, body, icon, image, vibration patterns, action buttons, etc.), preview them in real-time, and verify how they render across different platforms before deploying to production.

Web Push notifications require a Service Worker because the push event from a server can arrive even when the browser tab is closed. The Service Worker acts as a background listener that receives push messages and displays notifications. For local testing with this tool, we use the Notification API directly, which doesn't require a Service Worker.

VAPID (Voluntary Application Server Identification) keys use ECDSA P-256 cryptography to authenticate your push server with browser push services (like Firebase Cloud Messaging or Mozilla's push service). The public key is used in the browser to create a push subscription, while the private key stays on your server to sign push messages. This prevents unauthorized parties from sending notifications to your users.

Icon: The main notification icon (displayed on all platforms, typically 192x192px).
Badge: A small monochrome icon shown in the Android status bar (typically 72x72px, alpha channel only).
Image: A large hero image displayed in expanded notifications on Android (typically 360x180px or similar aspect ratio).

The tag property groups related notifications. If you send multiple notifications with the same tag, newer ones replace older ones instead of stacking up. Combined with renotify: true, the replacement will re-alert the user (vibration/sound). This is useful for chat apps or real-time updates where you want to avoid notification spam.

Web Push is supported by Chrome, Firefox, Edge, Opera, and Samsung Internet on desktop and Android. Safari on macOS supports it starting from version 16 (macOS Ventura). iOS Safari added support from iOS 16.4+. Internet Explorer does not support Web Push. Always check caniuse.com/push-api for the latest compatibility data.

Yes! Enable the "Silent" toggle in the configuration panel. Silent notifications display without sound or vibration. Note that on some platforms (especially Android), silent notifications may still cause a brief visual indicator. Silent notifications are useful for non-urgent updates like data sync confirmations or background refreshes.

Notification action buttons (actions) require a Service Worker to handle the notificationclick event. When using the Notification API directly (as this tool does for local testing), browsers may not fire action click handlers reliably. For full action button support in production, you must register a Service Worker that listens for notification click events.