https://github.com/cap-go/capacitor-navigation-bar
Capacitor plugin Set navigation bar color for android lolipop and higher
https://github.com/cap-go/capacitor-navigation-bar
capacitor capacitor-plugin plugin
Last synced: about 1 month ago
JSON representation
Capacitor plugin Set navigation bar color for android lolipop and higher
- Host: GitHub
- URL: https://github.com/cap-go/capacitor-navigation-bar
- Owner: Cap-go
- License: mpl-2.0
- Created: 2023-03-10T01:27:17.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2026-04-01T16:11:13.000Z (2 months ago)
- Last Synced: 2026-04-01T23:28:20.905Z (2 months ago)
- Topics: capacitor, capacitor-plugin, plugin
- Language: TypeScript
- Homepage: https://capgo.app
- Size: 1.55 MB
- Stars: 21
- Watchers: 1
- Forks: 6
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Agents: AGENTS.md
Awesome Lists containing this project
README
# capacitor-navigation-bar
Set navigation bar color for android lollipop and higher
## Documentation
The most complete doc is available here: https://capgo.app/docs/plugins/navigation-bar/
## Compatibility
| Plugin version | Capacitor compatibility | Maintained |
| -------------- | ----------------------- | ---------- |
| v8.\*.\* | v8.\*.\* | ✅ |
| v7.\*.\* | v7.\*.\* | On demand |
| v6.\*.\* | v6.\*.\* | ❌ |
| v5.\*.\* | v5.\*.\* | ❌ |
> **Note:** The major version of this plugin follows the major version of Capacitor. Use the version that matches your Capacitor installation (e.g., plugin v8 for Capacitor 8). Only the latest major version is actively maintained.
## Install
```bash
npm install @capgo/capacitor-navigation-bar
npx cap sync
```
## Example Apps
- `example-app`: Interactive showcase that exercises all plugin options (color presets, custom hex, dark buttons, state reading).
## API
* [`setNavigationBarColor(...)`](#setnavigationbarcolor)
* [`getNavigationBarColor()`](#getnavigationbarcolor)
* [`getPluginVersion()`](#getpluginversion)
* [Enums](#enums)
Capacitor Navigation Bar Plugin for customizing the Android navigation bar.
### setNavigationBarColor(...)
```typescript
setNavigationBarColor(options: { color: NavigationBarColor | string; darkButtons?: boolean; dividerColor?: NavigationBarColor | string; }) => Promise
```
Set the navigation bar color and button theme.
| Param | Type | Description |
| ------------- | ----------------------------------------------------------------------------- | --------------------------------------------- |
| **`options`** | { color: string; darkButtons?: boolean; dividerColor?: string; } | - Configuration for navigation bar appearance |
**Since:** 1.0.0
--------------------
### getNavigationBarColor()
```typescript
getNavigationBarColor() => Promise<{ color: string; darkButtons: boolean; }>
```
Get the current navigation bar color and button theme.
**Returns:** Promise<{ color: string; darkButtons: boolean; }>
**Since:** 1.0.0
--------------------
### getPluginVersion()
```typescript
getPluginVersion() => Promise<{ version: string; }>
```
Get the native Capacitor plugin version.
**Returns:** Promise<{ version: string; }>
**Since:** 1.0.0
--------------------
### Enums
#### NavigationBarColor
| Members | Value | Description |
| ----------------- | -------------------------- | ----------------- |
| **`WHITE`** | '#FFFFFF' | White color |
| **`BLACK`** | '#000000' | Black color |
| **`TRANSPARENT`** | 'transparent' | Transparent color |