The Notifications API allows web pages to control the display of system notifications to the end user. These are outside the top-level browsing context viewport, so therefore can be displayed even when the user has switched tabs or moved to a different app. The API is designed to be compatible with existing notification systems, across different platforms.
Concepts and usage
On supported platforms, showing a system notification generally involves two things. First, the user needs to grant the current origin permission to display system notifications, which is generally done when the app or site initialises, using the
Notification.requestPermission()
method. This will spawn a request dialog, along the following lines:From here the user can choose to allow notifications from this origin, block notifications from this origin, or not choose at this point. Once a choice has been made, the setting will generally persist for the current session.
Next, a new notification is created using the
Notification()
constructor. This must be passed a title argument, and can optionally be passed an options object to specify options, such as text direction, body text, icon to display, notification sound to play, and more.In addition, the Notifications API spec specifies a number of additions to the
ServiceWorker API, to allow service workers to fire notifications.
Notifications interfaces
Notification- Defines a notification object.
Service worker additions
ServiceWorkerRegistration- Includes the
ServiceWorkerRegistration.showNotification()andServiceWorkerRegistration.getNotifications()method, for controlling the display of notifications. ServiceWorkerGlobalScope- Includes the
ServiceWorkerGlobalScope.onnotificationclickhandler, for firing custom functions when a notification is clicked. NotificationEvent- A specific type of event object, based on
ExtendableEvent, which represents a notification that has fired.
Specifications
| Specification | Status | Comment |
|---|---|---|
| Notifications API | LSLiving Standard | Living standard |
Browser compatibility
Notification
Update compatibility data on GitHub
| Desktop | Mobile | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | Android webview | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | Safari on iOS | Samsung Internet | |
Notification | Chrome
22
| Edge 14 | Firefox
22
| IE No | Opera 25 | Safari 6 | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android
22
| Opera Android Yes | Safari iOS No | Samsung Internet Android ? |
| Available in workers | Chrome 45 | Edge Yes | Firefox 41 | IE No | Opera 32 | Safari ? | WebView Android No | Chrome Android 45 | Edge Mobile Yes | Firefox Android 41 | Opera Android 32 | Safari iOS No | Samsung Internet Android ? |
| Secure context required | Chrome 62 | Edge ? | Firefox ? | IE No | Opera 49 | Safari ? | WebView Android No | Chrome Android 62 | Edge Mobile ? | Firefox Android ? | Opera Android 49 | Safari iOS No | Samsung Internet Android ? |
Notification()
constructor | Chrome
22
| Edge Yes | Firefox
22
| IE No | Opera 25 | Safari 6 | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android
22
| Opera Android Yes | Safari iOS No | Samsung Internet Android ? |
actions | Chrome 53 | Edge 18 | Firefox No | IE No | Opera 39 | Safari ? | WebView Android No | Chrome Android 53 | Edge Mobile No | Firefox Android No | Opera Android 39 | Safari iOS No | Samsung Internet Android ? |
badge | Chrome 53 | Edge 18 | Firefox No | IE No | Opera 39 | Safari ? | WebView Android No | Chrome Android 53 | Edge Mobile No | Firefox Android No | Opera Android 39 | Safari iOS No | Samsung Internet Android ? |
body | Chrome Yes | Edge 14 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
data | Chrome Yes | Edge 16 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
dir | Chrome Yes | Edge 14 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
icon | Chrome
22
| Edge 14 | Firefox
22
| IE No | Opera 25 | Safari No | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android
22
| Opera Android Yes | Safari iOS No | Samsung Internet Android ? |
image | Chrome 53 | Edge 18 | Firefox No | IE No | Opera 40 | Safari ? | WebView Android No | Chrome Android 53 | Edge Mobile ? | Firefox Android No | Opera Android 40 | Safari iOS No | Samsung Internet Android ? |
lang | Chrome Yes | Edge 14 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
maxActions | Chrome Yes | Edge 18 | Firefox No | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android No | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
onclick | Chrome Yes | Edge 14 | Firefox No | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android No | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
onclose | Chrome Yes | Edge 14 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
onerror | Chrome Yes | Edge 14 | Firefox No | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android No | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
onshow | Chrome Yes | Edge 14 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
permission | Chrome Yes | Edge 14 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
renotify | Chrome 50 | Edge No | Firefox No | IE No | Opera 37 | Safari No | WebView Android No | Chrome Android 50 | Edge Mobile No | Firefox Android No | Opera Android 37 | Safari iOS No | Samsung Internet Android ? |
requireInteraction | Chrome Yes | Edge 17 | Firefox No | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile No | Firefox Android No | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
silent | Chrome 43 | Edge 17 | Firefox No | IE No | Opera 30 | Safari No | WebView Android No | Chrome Android 43 | Edge Mobile No | Firefox Android No | Opera Android 30 | Safari iOS No | Samsung Internet Android ? |
tag | Chrome Yes | Edge 14 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
timestamp | Chrome Yes | Edge 17 | Firefox No | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile No | Firefox Android No | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
title | Chrome Yes | Edge 14 | Firefox No | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android No | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
vibrate | Chrome 53 | Edge No | Firefox No | IE No | Opera 39 | Safari ? | WebView Android No | Chrome Android 53 | Edge Mobile No | Firefox Android No | Opera Android 39 | Safari iOS No | Samsung Internet Android ? |
close | Chrome Yes | Edge 14 | Firefox Yes | IE No | Opera ? | Safari ? | WebView Android No | Chrome Android Yes | Edge Mobile ? | Firefox Android Yes | Opera Android ? | Safari iOS No | Samsung Internet Android ? |
requestPermission | Chrome 46 | Edge 14 | Firefox 47 | IE No | Opera 40 | Safari ? | WebView Android No | Chrome Android 46 | Edge Mobile ? | Firefox Android Yes | Opera Android 40 | Safari iOS No | Samsung Internet Android ? |
Legend
- Full support
- No support
- Compatibility unknown
- See implementation notes.
- Requires a vendor prefix or different name for use.


