---
description: Capacitor plugin to access and update the badge number of the app icon. It supports setting, clearing, and checking badge counts.
title: Capacitor Badge Plugin for Android, iOS & Web - Capawesome
image: https://capawesome.io/docs/assets/images/social/sdks/capacitor/badge.png
---

<!doctype html> 

[Skip to content ](#capacitor-badge-plugin) 

[📲 Introducing **Build Sharing** — get your builds onto testers' devices with a link & QR code. No account required. ](/blog/share-mobile-app-builds-with-testers/) 

* [ SDKs ](/docs/sdks/)
* [ iOS ](#ios)
* [ Configuration ](#configuration)
* [ Demo ](#demo)
* [ Usage ](#usage)
* [ API ](#api)
* [ Type Aliases ](#type-aliases)
* [ Quirks ](#quirks)
* [ FAQ ](#faq)
* [ Related Plugins ](#related-plugins)
* [ Newsletter ](#newsletter)
* [ Changelog ](#changelog)
* [ License ](#license)
* [ Credits ](#credits)
* [ Barcode Scanner ](/docs/sdks/capacitor/barcode-scanner/)
* [ Barometer ](/docs/sdks/capacitor/barometer/)
* [ Battery ](/docs/sdks/capacitor/battery/)
* [ Biometrics ](/docs/sdks/capacitor/biometrics/)
* [ Bluetooth Low Energy ](/docs/sdks/capacitor/bluetooth-low-energy/)
* [ Calendar ](/docs/sdks/capacitor/calendar/)
* [ Clipboard ](/docs/sdks/capacitor/clipboard/)
* [ Cloudinary ](/docs/sdks/capacitor/cloudinary/)
* [ Compass ](/docs/sdks/capacitor/compass/)
* [ Contacts ](/docs/sdks/capacitor/contacts/)
* [ Crisp ](/docs/sdks/capacitor/crisp/)
* [ Datetime Picker ](/docs/sdks/capacitor/datetime-picker/)
* [ Device Info ](/docs/sdks/capacitor/device-info/)
* [ Dialog ](/docs/sdks/capacitor/dialog/)
* [ Document Scanner ](/docs/sdks/capacitor/document-scanner/)
* [ Electron ](/docs/sdks/capacitor/electron/)
* [ Exif ](/docs/sdks/capacitor/exif/)
* [ Facebook Sign-In ](/docs/sdks/capacitor/facebook-sign-in/)
* [ File Compressor ](/docs/sdks/capacitor/file-compressor/)
* [ File Manager ](/docs/sdks/capacitor/file-manager/)
* [ File Opener ](/docs/sdks/capacitor/file-opener/)
* [ File Picker ](/docs/sdks/capacitor/file-picker/)
* [ File Transfer ](/docs/sdks/capacitor/file-transfer/)
* [ Firebase ](/docs/sdks/capacitor/firebase/)
* [ Formbricks ](/docs/sdks/capacitor/formbricks/)
* [ Geocoder ](/docs/sdks/capacitor/geocoder/)
* [ Geofences ](/docs/sdks/capacitor/geofences/)
* [ Google Sign-In ](/docs/sdks/capacitor/google-sign-in/)
* [ Grafana Faro ](/docs/sdks/capacitor/grafana-faro/)
* [ Gyroscope ](/docs/sdks/capacitor/gyroscope/)
* [ Haptics ](/docs/sdks/capacitor/haptics/)
* [ Health ](/docs/sdks/capacitor/health/)
* [ Home Indicator ](/docs/sdks/capacitor/home-indicator/)
* [ In-App Browser ](/docs/sdks/capacitor/in-app-browser/)
* [ Install Referrer ](/docs/sdks/capacitor/install-referrer/)
* [ Intercom ](/docs/sdks/capacitor/intercom/)
* [ Intune ](/docs/sdks/capacitor/intune/)
* [ Keep Awake ](/docs/sdks/capacitor/keep-awake/)
* [ libSQL ](/docs/sdks/capacitor/libsql/)
* [ Light Sensor ](/docs/sdks/capacitor/light-sensor/)
* [ Live Update ](/docs/sdks/capacitor/live-update/)
* [ LLM ](/docs/sdks/capacitor/llm/)
* [ Localization ](/docs/sdks/capacitor/localization/)
* [ Mail Composer ](/docs/sdks/capacitor/mail-composer/)
* [ Managed Configurations ](/docs/sdks/capacitor/managed-configurations/)
* [ MapLibre ](/docs/sdks/capacitor/maplibre/)
* [ Maps Launcher ](/docs/sdks/capacitor/maps-launcher/)
* [ Media Session ](/docs/sdks/capacitor/media-session/)
* [ ML Kit ](/docs/sdks/capacitor/mlkit/)
* [ Navigation Bar ](/docs/sdks/capacitor/navigation-bar/)
* [ Network ](/docs/sdks/capacitor/network/)
* [ NFC ](/docs/sdks/capacitor/nfc/)
* [ Node.js ](/docs/sdks/capacitor/nodejs/)
* [ OAuth ](/docs/sdks/capacitor/oauth/)
* [ Passkeys ](/docs/sdks/capacitor/passkeys/)
* [ Password Autofill ](/docs/sdks/capacitor/password-autofill/)
* [ PDF Generator ](/docs/sdks/capacitor/pdf-generator/)
* [ PDF Viewer ](/docs/sdks/capacitor/pdf-viewer/)
* [ Pedometer ](/docs/sdks/capacitor/pedometer/)
* [ Permissions ](/docs/sdks/capacitor/permissions/)
* [ Phone Dialer ](/docs/sdks/capacitor/phone-dialer/)
* [ Photo Editor ](/docs/sdks/capacitor/photo-editor/)
* [ Photo Manipulator ](/docs/sdks/capacitor/photo-manipulator/)
* [ PixLive ](/docs/sdks/capacitor/pixlive/)
* [ PostHog ](/docs/sdks/capacitor/posthog/)
* [ Printer ](/docs/sdks/capacitor/printer/)
* [ Privacy Screen ](/docs/sdks/capacitor/privacy-screen/)
* [ Proximity Sensor ](/docs/sdks/capacitor/proximity-sensor/)
* [ Purchases ](/docs/sdks/capacitor/purchases/)
* [ RealtimeKit ](/docs/sdks/capacitor/realtimekit/)
* [ Root Detection ](/docs/sdks/capacitor/root-detection/)
* [ Screen Brightness ](/docs/sdks/capacitor/screen-brightness/)
* [ Screen Orientation ](/docs/sdks/capacitor/screen-orientation/)
* [ Screen Reader ](/docs/sdks/capacitor/screen-reader/)
* [ Screenshot ](/docs/sdks/capacitor/screenshot/)
* [ Secure Preferences ](/docs/sdks/capacitor/secure-preferences/)
* [ Settings Launcher ](/docs/sdks/capacitor/settings-launcher/)
* [ Shake ](/docs/sdks/capacitor/shake/)
* [ Silent Mode ](/docs/sdks/capacitor/silent-mode/)
* [ SIM ](/docs/sdks/capacitor/sim/)
* [ SMS Composer ](/docs/sdks/capacitor/sms-composer/)
* [ Speech Recognition ](/docs/sdks/capacitor/speech-recognition/)
* [ Speech Synthesis ](/docs/sdks/capacitor/speech-synthesis/)
* [ Share Target ](/docs/sdks/capacitor/share-target/)
* [ Square Mobile Payments ](/docs/sdks/capacitor/square-mobile-payments/)
* [ SQLite ](/docs/sdks/capacitor/sqlite/)
* [ Superwall ](/docs/sdks/capacitor/superwall/)
* [ System WebView ](/docs/sdks/capacitor/system-webview/)
* [ Tauri ](/docs/sdks/capacitor/tauri/)
* [ Text Interaction ](/docs/sdks/capacitor/text-interaction/)
* [ Text Zoom ](/docs/sdks/capacitor/text-zoom/)
* [ Thermal State ](/docs/sdks/capacitor/thermal-state/)
* [ Toast ](/docs/sdks/capacitor/toast/)
* [ Torch ](/docs/sdks/capacitor/torch/)
* [ Vault ](/docs/sdks/capacitor/vault/)
* [ Volume ](/docs/sdks/capacitor/volume/)
* [ Wallet ](/docs/sdks/capacitor/wallet/)
* [ Watch ](/docs/sdks/capacitor/watch/)
* [ Wifi ](/docs/sdks/capacitor/wifi/)
* [ YouTube Player ](/docs/sdks/capacitor/youtube-player/)
* [ Zip ](/docs/sdks/capacitor/zip/)
* [ Cordova ](/docs/sdks/cordova/)
* [ Cloud ](/docs/cloud/)
* [ Integrations ](/docs/cloud/live-updates/integrations/)
* Concepts
* Reference
* [ Troubleshooting ](/docs/cloud/live-updates/troubleshooting/)
* [ FAQ ](/docs/cloud/live-updates/faq/)
* [ Native Builds ](/docs/cloud/native-builds/)
* [ Set Up Environments ](/docs/cloud/native-builds/environments/)
* [ Set Up Native Configurations ](/docs/cloud/native-builds/native-configurations/)
* [ Auto-Increment Build Numbers ](/docs/cloud/native-builds/auto-incrementing-build-numbers/)
* [ Configure the Web Build Script ](/docs/cloud/native-builds/web-build-script/)
* [ Build from a Monorepo ](/docs/cloud/native-builds/monorepo/)
* [ Use pnpm, Yarn, or bun ](/docs/cloud/native-builds/package-managers/)
* [ Install Private npm Packages ](/docs/cloud/native-builds/npm-private-registry/)
* [ Override the Java Version ](/docs/cloud/native-builds/override-java-version/)
* [ Custom iOS Provisioning Profiles ](/docs/cloud/native-builds/custom-ios-provisioning-profiles/)
* [ Build without Git ](/docs/cloud/native-builds/build-without-git/)
* [ Access Git Behind a Firewall ](/docs/cloud/native-builds/firewall-access/)
* [ Integrations ](/docs/cloud/native-builds/integrations/)
* Reference
* [ Troubleshooting ](/docs/cloud/native-builds/troubleshooting/)
* [ FAQ ](/docs/cloud/native-builds/faq/)
* [ App Store Publishing ](/docs/cloud/app-store-publishing/)
* [ Submit a Build ](/docs/cloud/app-store-publishing/submit-a-build/)
* [ Submit Automatically After a Build ](/docs/cloud/app-store-publishing/submit-automatically/)
* [ Troubleshooting ](/docs/cloud/app-store-publishing/troubleshooting/)
* [ FAQ ](/docs/cloud/app-store-publishing/faq/)
* [ Automations ](/docs/cloud/automations/)
* [ Reference ](/docs/cloud/automations/reference/)
* [ Troubleshooting ](/docs/cloud/automations/troubleshooting/)
* [ FAQ ](/docs/cloud/automations/faq/)
* [ Assist ](/docs/cloud/assist/)
* [ CLI ](/docs/cloud/cli/)
* APIs and SDKs
* [ Webhooks ](/docs/cloud/webhooks/)
* [ Integrations ](/docs/cloud/integrations/)
* Notifications
* Account
* [ Organization ](/docs/cloud/organizations/)
* [ Two-Factor Enforcement ](/docs/cloud/organizations/two-factor-authentication/)
* [ Network Restrictions ](/docs/cloud/organizations/network-restrictions/)
* [ Audit Logs ](/docs/cloud/organizations/audit-logs/)
* [ Billing ](/docs/cloud/organizations/billing/)
* [ License Keys ](/docs/cloud/license-keys/)
* [ AI ](/docs/ai/)
* [ Insiders ](/docs/insiders/)
* [ Billing & Plans ](/docs/insiders/billing-and-plans/)
* [ FAQ ](/docs/insiders/faq/)
* [ License ](https://capawesome.io/legal/eula/)
* [ Support ](/docs/support/)
* [ Contributing ](/docs/contributing/)
* Contributing code
* [ Code of Conduct ](/docs/contributing/code-of-conduct/)
* [ Questions ](https://docs.github.com/en/discussions/collaborating-with-your-community-using-discussions/participating-in-a-discussion#creating-a-discussion)
* [ Blog ](/blog/)
* Categories

* [ iOS ](#ios)
* [ Configuration ](#configuration)
* [ Demo ](#demo)
* [ Usage ](#usage)
* [ API ](#api)
* [ Type Aliases ](#type-aliases)
* [ Quirks ](#quirks)
* [ FAQ ](#faq)
* [ Related Plugins ](#related-plugins)
* [ Newsletter ](#newsletter)
* [ Changelog ](#changelog)
* [ License ](#license)
* [ Credits ](#credits)

Build and Ship Mobile Apps Faster

Cloud builds, OTA live updates, and automated store releases — everything your mobile team needs in one platform.

[Start for free ](https://console.cloud.capawesome.io/?utm%5Fsource=docs&utm%5Fmedium=sidebar%5Fcta&utm%5Fcampaign=docs%5Fcta) [See our plans ](https://capawesome.io/pricing/?utm%5Fsource=docs&utm%5Fmedium=sidebar%5Fcta&utm%5Fcampaign=docs%5Fcta) 

# Capacitor Badge Plugin[¶](#capacitor-badge-plugin "Permanent link")

Capacitor plugin to access and update the badge number of the app icon.

[ ![Deliver Live Updates to your Capacitor app with Capawesome Cloud](../../../assets/external/cloud.capawesome.io/assets/banners/cloud-build-and-deploy-capacitor-apps.69628c3f.png) ](https://cloud.capawesome.io/) 

## Features[¶](#features "Permanent link")

The Capacitor Badge plugin is one of the most complete app icon badge solutions for Capacitor apps. Here are some of the key features:

* 🖥️ **Cross-platform**: Supports Android, iOS, and Web (PWA).
* 🔢 **Badge management**: Get, set, increase, decrease, and clear badge counts.
* 💾 **Persistent badges**: Badge count persists after reboot or app restart.
* 🔄 **Auto-clear option**: Automatically reset counter when resuming the app.
* 🔐 **Permission handling**: Check and request badge display permissions.
* ⚙️ **Configurable**: Customize persistence and auto-clear behaviors.
* 🤝 **Compatibility**: Works alongside the [App Icon](https://capawesome.io/docs/sdks/capacitor/app-icon/) and [Firebase Cloud Messaging](https://capawesome.io/docs/sdks/capacitor/firebase/cloud-messaging/) plugins.
* 🔁 **Up-to-date**: Always supports the latest Capacitor version.

Missing a feature? Just [open an issue](https://github.com/capawesome-team/capacitor-plugins/issues) and we'll take a look!

## Use Cases[¶](#use-cases "Permanent link")

The Badge plugin is typically used to show a count on the app icon that reflects pending items, for example:

* **Unread messages**: Show the number of unread chat messages or emails on the app icon.
* **Pending notifications**: Keep the badge in sync with the notifications the user has not yet seen.
* **Open tasks**: Display the number of open to-dos, reminders, or items in a shopping cart.
* **Automatic reset**: Clear the counter automatically when the user resumes the app using the `autoClear` configuration option.

## Compatibility[¶](#compatibility "Permanent link")

| Plugin Version | Capacitor Version | Status         |
| -------------- | ----------------- | -------------- |
| 8.x.x          | \>=8.x.x          | Active support |
| 7.x.x          | 7.x.x             | Deprecated     |
| 6.x.x          | 6.x.x             | Deprecated     |
| 5.x.x          | 5.x.x             | Deprecated     |

## Installation[¶](#installation "Permanent link")

You can use our **AI-Assisted Setup** to install the plugin. Add the [Capawesome Skills](https://github.com/capawesome-team/skills) to your AI tool using the following command:

`[](#%5F%5Fcodelineno-0-1)npx skills add capawesome-team/skills --skill capacitor-plugins
`

Then use the following prompt:

`` [](#%5F%5Fcodelineno-1-1) Use the `capacitor-plugins` skill from `capawesome-team/skills` to install the `@capawesome/capacitor-badge` plugin in my project.
 ``

If you prefer **Manual Setup**, install the plugin by running the following commands and follow the platform-specific instructions below:

`[](#%5F%5Fcodelineno-2-1)npm install @capawesome/capacitor-badge
[](#%5F%5Fcodelineno-2-2)npx cap sync
`

### Android[¶](#android "Permanent link")

#### Variables[¶](#variables "Permanent link")

If needed, you can define the following project variable in your app’s `variables.gradle` file to change the default version of the dependency:

* `$shortcutBadgerVersion` version of `me.leolin:ShortcutBadger` (default: `1.1.22`)

This can be useful if you encounter dependency conflicts with other plugins in your project.

### iOS[¶](#ios "Permanent link")

#### Privacy manifest[¶](#privacy-manifest "Permanent link")

Add the `NSPrivacyAccessedAPICategoryUserDefaults` dictionary key to your [Privacy Manifest](https://capacitorjs.com/docs/ios/privacy-manifest) (usually `ios/App/PrivacyInfo.xcprivacy`):

`[](#%5F%5Fcodelineno-3-1)<?xml version="1.0" encoding="UTF-8"?>
[](#%5F%5Fcodelineno-3-2)<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
[](#%5F%5Fcodelineno-3-3)<plist version="1.0">
[](#%5F%5Fcodelineno-3-4)  <dict>
[](#%5F%5Fcodelineno-3-5)    <key>NSPrivacyAccessedAPITypes</key>
[](#%5F%5Fcodelineno-3-6)    <array>
[](#%5F%5Fcodelineno-3-7)      <!-- Add this dict entry to the array if the file already exists. -->
[](#%5F%5Fcodelineno-3-8)      <dict>
[](#%5F%5Fcodelineno-3-9)        <key>NSPrivacyAccessedAPIType</key>
[](#%5F%5Fcodelineno-3-10)        <string>NSPrivacyAccessedAPICategoryUserDefaults</string>
[](#%5F%5Fcodelineno-3-11)        <key>NSPrivacyAccessedAPITypeReasons</key>
[](#%5F%5Fcodelineno-3-12)        <array>
[](#%5F%5Fcodelineno-3-13)          <string>CA92.1</string>
[](#%5F%5Fcodelineno-3-14)        </array>
[](#%5F%5Fcodelineno-3-15)      </dict>
[](#%5F%5Fcodelineno-3-16)    </array>
[](#%5F%5Fcodelineno-3-17)  </dict>
[](#%5F%5Fcodelineno-3-18)</plist>
`

## Configuration[¶](#configuration "Permanent link")

These configuration values are available:

| Prop          | Type    | Description                                                                                                                                                                  | Default |
| ------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- |
| **persist**   | boolean | Configure whether the plugin should restore the counter after a reboot or app restart. Only available on Android and iOS.                                                    | true    |
| **autoClear** | boolean | Configure whether the plugin should reset the counter after resuming the application. On **iOS**, this will also clear all notifications. Only available on Android and iOS. | false   |

### Examples[¶](#examples "Permanent link")

In `capacitor.config.json`:

`[](#%5F%5Fcodelineno-4-1){
[](#%5F%5Fcodelineno-4-2)  "plugins": {
[](#%5F%5Fcodelineno-4-3)    "Badge": {
[](#%5F%5Fcodelineno-4-4)      "persist": true,
[](#%5F%5Fcodelineno-4-5)      "autoClear": false
[](#%5F%5Fcodelineno-4-6)    }
[](#%5F%5Fcodelineno-4-7)  }
[](#%5F%5Fcodelineno-4-8)}
`

In `capacitor.config.ts`:

`[](#%5F%5Fcodelineno-5-1)/// <reference types="@capawesome/capacitor-badge" />
[](#%5F%5Fcodelineno-5-2)
[](#%5F%5Fcodelineno-5-3)import { CapacitorConfig } from '@capacitor/cli';
[](#%5F%5Fcodelineno-5-4)
[](#%5F%5Fcodelineno-5-5)const config: CapacitorConfig = {
[](#%5F%5Fcodelineno-5-6)  plugins: {
[](#%5F%5Fcodelineno-5-7)    Badge: {
[](#%5F%5Fcodelineno-5-8)      persist: true,
[](#%5F%5Fcodelineno-5-9)      autoClear: false,
[](#%5F%5Fcodelineno-5-10)    },
[](#%5F%5Fcodelineno-5-11)  },
[](#%5F%5Fcodelineno-5-12)};
[](#%5F%5Fcodelineno-5-13)
[](#%5F%5Fcodelineno-5-14)export default config;
`

## Demo[¶](#demo "Permanent link")

A working example can be found here: [robingenz/capacitor-plugin-demo](https://github.com/robingenz/capacitor-plugin-demo)

## Usage[¶](#usage "Permanent link")

The following examples show how to get, set, increase, decrease, and clear the badge count, check whether badges are supported, and check and request permissions.

### Get the current badge count[¶](#get-the-current-badge-count "Permanent link")

Read the current badge count. The count won't be lost after a reboot or app restart:

`[](#%5F%5Fcodelineno-6-1)import { Badge } from '@capawesome/capacitor-badge';
[](#%5F%5Fcodelineno-6-2)
[](#%5F%5Fcodelineno-6-3)const get = async () => {
[](#%5F%5Fcodelineno-6-4)  const result = await Badge.get();
[](#%5F%5Fcodelineno-6-5)  return result.count;
[](#%5F%5Fcodelineno-6-6)};
`

### Set the badge count[¶](#set-the-badge-count "Permanent link")

Set the badge count to a specific value. On iOS, setting the count to `0` will remove the badge and also clear all notifications:

`[](#%5F%5Fcodelineno-7-1)import { Badge } from '@capawesome/capacitor-badge';
[](#%5F%5Fcodelineno-7-2)
[](#%5F%5Fcodelineno-7-3)const set = async (count: number) => {
[](#%5F%5Fcodelineno-7-4)  await Badge.set({ count });
[](#%5F%5Fcodelineno-7-5)};
`

### Increase or decrease the badge count[¶](#increase-or-decrease-the-badge-count "Permanent link")

Increment or decrement the badge count by one, for example when a new message arrives or is read:

`[](#%5F%5Fcodelineno-8-1)import { Badge } from '@capawesome/capacitor-badge';
[](#%5F%5Fcodelineno-8-2)
[](#%5F%5Fcodelineno-8-3)const increase = async () => {
[](#%5F%5Fcodelineno-8-4)  await Badge.increase();
[](#%5F%5Fcodelineno-8-5)};
[](#%5F%5Fcodelineno-8-6)
[](#%5F%5Fcodelineno-8-7)const decrease = async () => {
[](#%5F%5Fcodelineno-8-8)  await Badge.decrease();
[](#%5F%5Fcodelineno-8-9)};
`

### Clear the badge count[¶](#clear-the-badge-count "Permanent link")

Remove the badge from the app icon. On iOS, this will also clear all notifications:

`[](#%5F%5Fcodelineno-9-1)import { Badge } from '@capawesome/capacitor-badge';
[](#%5F%5Fcodelineno-9-2)
[](#%5F%5Fcodelineno-9-3)const clear = async () => {
[](#%5F%5Fcodelineno-9-4)  await Badge.clear();
[](#%5F%5Fcodelineno-9-5)};
`

### Check if badges are supported[¶](#check-if-badges-are-supported "Permanent link")

Check whether the badge count is supported on the current device, for example since not every Android launcher supports badges:

`[](#%5F%5Fcodelineno-10-1)import { Badge } from '@capawesome/capacitor-badge';
[](#%5F%5Fcodelineno-10-2)
[](#%5F%5Fcodelineno-10-3)const isSupported = async () => {
[](#%5F%5Fcodelineno-10-4)  const result = await Badge.isSupported();
[](#%5F%5Fcodelineno-10-5)  return result.isSupported;
[](#%5F%5Fcodelineno-10-6)};
`

### Check and request permissions[¶](#check-and-request-permissions "Permanent link")

Check and request the permission to display the badge:

`[](#%5F%5Fcodelineno-11-1)import { Badge } from '@capawesome/capacitor-badge';
[](#%5F%5Fcodelineno-11-2)
[](#%5F%5Fcodelineno-11-3)const checkPermissions = async () => {
[](#%5F%5Fcodelineno-11-4)  const result = await Badge.checkPermissions();
[](#%5F%5Fcodelineno-11-5)};
[](#%5F%5Fcodelineno-11-6)
[](#%5F%5Fcodelineno-11-7)const requestPermissions = async () => {
[](#%5F%5Fcodelineno-11-8)  const result = await Badge.requestPermissions();
[](#%5F%5Fcodelineno-11-9)};
`

## API[¶](#api "Permanent link")

* [get()](#get)
* [set(...)](#set)
* [increase()](#increase)
* [decrease()](#decrease)
* [clear()](#clear)
* [isSupported()](#issupported)
* [checkPermissions()](#checkpermissions)
* [requestPermissions()](#requestpermissions)
* [Interfaces](#interfaces)
* [Type Aliases](#type-aliases)

### get()[¶](#get "Permanent link")

`[](#%5F%5Fcodelineno-12-1)get() => Promise<GetBadgeResult>
`

Get the badge count. The badge count won't be lost after a reboot or app restart.

Default: `0`.

**Returns:** `Promise<[GetBadgeResult](#getbadgeresult)>`

---

### set(...)[¶](#set "Permanent link")

`[](#%5F%5Fcodelineno-13-1)set(options: SetBadgeOptions) => Promise<void>
`

Set the badge count.

| Param       | Type                                |
| ----------- | ----------------------------------- |
| **options** | [SetBadgeOptions](#setbadgeoptions) |

---

### increase()[¶](#increase "Permanent link")

`[](#%5F%5Fcodelineno-14-1)increase() => Promise<void>
`

Increase the badge count.

---

### decrease()[¶](#decrease "Permanent link")

`[](#%5F%5Fcodelineno-15-1)decrease() => Promise<void>
`

Decrease the badge count.

---

### clear()[¶](#clear "Permanent link")

`[](#%5F%5Fcodelineno-16-1)clear() => Promise<void>
`

Clear the badge count.

On **iOS**, this will remove the badge and also clear all notifications.

---

### isSupported()[¶](#issupported "Permanent link")

`[](#%5F%5Fcodelineno-17-1)isSupported() => Promise<IsSupportedResult>
`

Check if the badge count is supported.

**Returns:** `Promise<[IsSupportedResult](#issupportedresult)>`

---

### checkPermissions()[¶](#checkpermissions "Permanent link")

`[](#%5F%5Fcodelineno-18-1)checkPermissions() => Promise<PermissionStatus>
`

Check permission to display badge.

**Returns:** `Promise<[PermissionStatus](#permissionstatus)>`

---

### requestPermissions()[¶](#requestpermissions "Permanent link")

`[](#%5F%5Fcodelineno-19-1)requestPermissions() => Promise<PermissionStatus>
`

Request permission to display badge.

**Returns:** `Promise<[PermissionStatus](#permissionstatus)>`

---

### Interfaces[¶](#interfaces "Permanent link")

#### GetBadgeResult[¶](#getbadgeresult "Permanent link")

| Prop      | Type   |
| --------- | ------ |
| **count** | number |

#### SetBadgeOptions[¶](#setbadgeoptions "Permanent link")

| Prop      | Type   | Description                                                                                                        |
| --------- | ------ | ------------------------------------------------------------------------------------------------------------------ |
| **count** | number | The badge count to set. On **iOS**, setting the count to 0 will remove the badge and also clear all notifications. |

#### IsSupportedResult[¶](#issupportedresult "Permanent link")

| Prop            | Type    |
| --------------- | ------- |
| **isSupported** | boolean |

#### PermissionStatus[¶](#permissionstatus "Permanent link")

| Prop        | Type                                | Description                               |
| ----------- | ----------------------------------- | ----------------------------------------- |
| **display** | [PermissionState](#permissionstate) | Permission state of displaying the badge. |

### Type Aliases[¶](#type-aliases "Permanent link")

#### PermissionState[¶](#permissionstate "Permanent link")

`'prompt' | 'prompt-with-rationale' | 'granted' | 'denied'`

## Quirks[¶](#quirks "Permanent link")

On **Android** there is no official API to set a badge, so not all launchers support badges. This plugin uses [ShortcutBadger](https://github.com/leolin310148/ShortcutBadger), which relies on vendor-specific mechanisms. All supported launchers are listed [there](https://github.com/leolin310148/ShortcutBadger#supported-launchers). On stock Android launchers, such as the Pixel Launcher, no badge is displayed.

On **Web**, the app must run as an installed PWA (in the taskbar or dock).

## FAQ[¶](#faq "Permanent link")

### Why is the badge not showing on my Android device?[¶](#why-is-the-badge-not-showing-on-my-android-device "Permanent link")

Android provides no official API to set a badge on the launcher icon. This plugin therefore uses [ShortcutBadger](https://github.com/leolin310148/ShortcutBadger) under the hood, which relies on vendor-specific mechanisms offered by some manufacturers (such as Samsung, Xiaomi, HTC and Sony). Only the launchers listed as [supported launchers](https://github.com/leolin310148/ShortcutBadger#supported-launchers) can display the badge. On stock Android launchers, most notably the Pixel Launcher, no badge is displayed. You can use the `isSupported()` method to check whether badges are supported on the current device.

### Can the plugin display an Android notification badge (dot) instead?[¶](#can-the-plugin-display-an-android-notification-badge-dot-instead "Permanent link")

No. Since Android 8.0, the launcher displays a [notification badge](https://developer.android.com/develop/ui/views/notifications/badges) only while the app has an _active_ notification. The badge is derived from that notification and disappears as soon as the notification is dismissed, so it cannot be set independently of one. On stock Android it is also a dot without a count. If your app already displays notifications, the badge is shown automatically without any plugin call.

### Does the badge count persist after a reboot or app restart?[¶](#does-the-badge-count-persist-after-a-reboot-or-app-restart "Permanent link")

Yes, by default the badge count is restored after a reboot or app restart. You can disable this behavior by setting the `persist` configuration option to `false`, see the [Configuration](#configuration) section.

### How can I automatically clear the badge when the app is resumed?[¶](#how-can-i-automatically-clear-the-badge-when-the-app-is-resumed "Permanent link")

Set the `autoClear` configuration option to `true` to reset the counter after resuming the application. Note that on iOS, this will also clear all notifications. See the [Configuration](#configuration) section for an example.

### Why does `checkPermissions()` always return `granted` on Android and Web?[¶](#why-does-checkpermissions-always-return-granted-on-android-and-web "Permanent link")

Only iOS requires a permission to display a badge. On Android and Web no permission is needed, so the permission state is always `granted`.

### Why does clearing the badge also remove my notifications on iOS?[¶](#why-does-clearing-the-badge-also-remove-my-notifications-on-ios "Permanent link")

On iOS, calling `clear()` or setting the badge count to `0` removes the badge and also clears all notifications. This is platform behavior and cannot be changed by the plugin.

### Does this plugin work on the Web?[¶](#does-this-plugin-work-on-the-web "Permanent link")

Yes, but the app must run as an installed PWA (in the taskbar or dock). Also make sure to check whether the browser supports badges using the `isSupported()` method.

### Can I use this plugin with Ionic, React, Vue or Angular?[¶](#can-i-use-this-plugin-with-ionic-react-vue-or-angular "Permanent link")

Yes, the plugin is framework-agnostic. It works in any Capacitor app regardless of the web framework, including Ionic with Angular, React, or Vue, as well as plain JavaScript projects.

## Related Plugins[¶](#related-plugins "Permanent link")

* [App Icon](https://capawesome.io/docs/sdks/capacitor/app-icon/): Change the app icon at runtime.
* [App Shortcuts](https://capawesome.io/docs/sdks/capacitor/app-shortcuts/): Manage app shortcuts and quick actions.
* [Firebase Cloud Messaging](https://capawesome.io/docs/sdks/capacitor/firebase/cloud-messaging/): Receive push notifications via Firebase Cloud Messaging.

## Newsletter[¶](#newsletter "Permanent link")

Stay up to date with the latest news and updates about the Capawesome, Capacitor, and Ionic ecosystem by subscribing to our [Capawesome Newsletter](https://cloud.capawesome.io/newsletter/).

## Changelog[¶](#changelog "Permanent link")

See [CHANGELOG.md](https://github.com/capawesome-team/capacitor-plugins/blob/main/packages/badge/CHANGELOG.md).

## License[¶](#license "Permanent link")

See [LICENSE](https://github.com/capawesome-team/capacitor-plugins/blob/main/packages/badge/LICENSE).

## Credits[¶](#credits "Permanent link")

This plugin is based on the [Capacitor Badge](https://github.com/capawesome-team/capacitor-badge) plugin. Thanks to everyone who contributed to the project!

July 8, 2026 

Back to top

```json
{"@context": "https://schema.org", "@graph": [{"@type": "TechArticle", "@id": "https://capawesome.io/docs/sdks/capacitor/badge/#article", "headline": "Capacitor Badge Plugin for Android, iOS & Web", "name": "Capacitor Badge Plugin for Android, iOS & Web", "description": "Capacitor plugin to access and update the badge number of the app icon. It supports setting, clearing, and checking badge counts.", "inLanguage": "en", "url": "https://capawesome.io/docs/sdks/capacitor/badge/", "mainEntityOfPage": "https://capawesome.io/docs/sdks/capacitor/badge/", "author": {"@type": "Organization", "name": "Capawesome", "url": "https://capawesome.io", "logo": {"@type": "ImageObject", "url": "https://capawesome.io/assets/images/logo.svg"}}, "publisher": {"@type": "Organization", "name": "Capawesome", "url": "https://capawesome.io", "logo": {"@type": "ImageObject", "url": "https://capawesome.io/assets/images/logo.svg"}}, "about": {"@id": "https://capawesome.io/docs/sdks/capacitor/badge/#software"}}, {"@type": "SoftwareSourceCode", "@id": "https://capawesome.io/docs/sdks/capacitor/badge/#software", "name": "Capacitor Badge Plugin for Android, iOS & Web", "description": "Capacitor plugin to access and update the badge number of the app icon. It supports setting, clearing, and checking badge counts.", "url": "https://capawesome.io/docs/sdks/capacitor/badge/", "programmingLanguage": "TypeScript", "runtimePlatform": "Capacitor", "codeRepository": "https://github.com/capawesome-team", "author": {"@type": "Organization", "name": "Capawesome", "url": "https://capawesome.io", "logo": {"@type": "ImageObject", "url": "https://capawesome.io/assets/images/logo.svg"}}, "publisher": {"@type": "Organization", "name": "Capawesome", "url": "https://capawesome.io", "logo": {"@type": "ImageObject", "url": "https://capawesome.io/assets/images/logo.svg"}}}]}
{"@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [{"@type": "Question", "name": "Why is the badge not showing on my Android device?", "acceptedAnswer": {"@type": "Answer", "text": "Android provides no official API to set a badge on the launcher icon. This plugin therefore uses ShortcutBadger under the hood, which relies on vendor-specific mechanisms offered by some manufacturers (such as Samsung, Xiaomi, HTC and Sony). Only the launchers listed as supported launchers can display the badge. On stock Android launchers, most notably the Pixel Launcher, no badge is displayed. You can use the isSupported() method to check whether badges are supported on the current device."}}, {"@type": "Question", "name": "Can the plugin display an Android notification badge (dot) instead?", "acceptedAnswer": {"@type": "Answer", "text": "No. Since Android 8.0, the launcher displays a notification badge only while the app has an active notification. The badge is derived from that notification and disappears as soon as the notification is dismissed, so it cannot be set independently of one. On stock Android it is also a dot without a count. If your app already displays notifications, the badge is shown automatically without any plugin call."}}, {"@type": "Question", "name": "Does the badge count persist after a reboot or app restart?", "acceptedAnswer": {"@type": "Answer", "text": "Yes, by default the badge count is restored after a reboot or app restart. You can disable this behavior by setting the persist configuration option to false, see the Configuration section."}}, {"@type": "Question", "name": "How can I automatically clear the badge when the app is resumed?", "acceptedAnswer": {"@type": "Answer", "text": "Set the autoClear configuration option to true to reset the counter after resuming the application. Note that on iOS, this will also clear all notifications. See the Configuration section for an example."}}, {"@type": "Question", "name": "Why does checkPermissions() always return granted on Android and Web?", "acceptedAnswer": {"@type": "Answer", "text": "Only iOS requires a permission to display a badge. On Android and Web no permission is needed, so the permission state is always granted."}}, {"@type": "Question", "name": "Why does clearing the badge also remove my notifications on iOS?", "acceptedAnswer": {"@type": "Answer", "text": "On iOS, calling clear() or setting the badge count to 0 removes the badge and also clears all notifications. This is platform behavior and cannot be changed by the plugin."}}, {"@type": "Question", "name": "Does this plugin work on the Web?", "acceptedAnswer": {"@type": "Answer", "text": "Yes, but the app must run as an installed PWA (in the taskbar or dock). Also make sure to check whether the browser supports badges using the isSupported() method."}}, {"@type": "Question", "name": "Can I use this plugin with Ionic, React, Vue or Angular?", "acceptedAnswer": {"@type": "Answer", "text": "Yes, the plugin is framework-agnostic. It works in any Capacitor app regardless of the web framework, including Ionic with Angular, React, or Vue, as well as plain JavaScript projects."}}], "url": "https://capawesome.io/docs/sdks/capacitor/badge/"}
```
