Skip to content
Angular Toolbar

Angular Toolbar

Dev tools for Angular — toggle feature flags, manage permissions, and save presets without leaving your current page or touching production code.
Get Started Try Demo View on GitHub

Install

Section titled “Install”
Terminal window
npm install ngx-dev-toolbar

See It in Action

Section titled “See It in Action”
Angular Toolbar demo showing feature flags, permissions, and preset management

Toggle feature flags, manage permissions, and save presets — all from the toolbar.

Built-in Tools

Section titled “Built-in Tools”

Feature Flags

Toggle features on or off in real-time without backend changes. Test different user experiences and validate A/B scenarios during development.

Permissions

Test role-based access control by forcing permissions on or off. Verify authorization logic without switching user accounts.

Presets

Save complete toolbar configurations as presets. Switch between QA, demo, and debug setups with one click.

Custom Tools

Build your own tools using the toolbar’s extensible architecture. See the custom tool guide.

Key Features

Section titled “Key Features”
  • Zero Production Impact — toolbar code is tree-shaken out of production builds
  • Secure Implementation — only loads in development mode via isDevMode()
  • Persistent Settings — all overrides are saved to localStorage across sessions
  • Hidden by Default — toggle visibility with Ctrl+Shift+D
  • Custom Tools Support — extend the toolbar with your own tools