Angular Component Overvie Chrome extension icon

Angular Component Overvie

👥 1K+ users
📦 v2.5
💾 874KiB
📅 2024-03-17
View on Chrome Web Store

Chrome will indicate if you already have this installed.

Overview

This browser extension allows you to easily visualize the component tree of an Angular application, making it easy to understand the structure and relationships of the components.

Activate the extension and select which components to outline, either selectively by component name (or by component selector) or component family identified by a prefix (e.g. material components: mat-).

When it comes to code review, Angular Outliner can be a powerful tool. It allows developers to quickly demonstrate and show the component hierarchy of the new code increment. This makes code reviews more efficient and effective, saving you time and effort.

______________________________________________________________________________________________

Support me: buymeacoffee.com/felixff

______________________________________________________________________________________________

Chrome extension that helps to visualize application components by drawing a frame around them.

You can choose between component namespaces defined by prefixes (e.g. `app` - application components, `mat` - material components, etc.) or specific components.

The extension also shows component instances count.

______________________________________________________________________________________________
Update 2.5
* UI simplification

Update 2.4
* Outline component on hover
* Component graph preview

Update 2.3:
* Improved component name positioning when multiple components occupy the same space, so labels do not overlap.
* Improved UX when scrolling - components are redrawn.

Tags

Productivity/developer productivity/developer

Privacy Practices

Not being sold to third parties, outside of the approved use cases
Not being used or transferred for purposes that are unrelated to the item's core functionality
Not being used or transferred to determine creditworthiness or for lending purposes

🔐 Security Analysis

⏳ Security scan is queued. Check back soon.

Capture a screenshot of your current page in entirety and reliably—without requesting any extra permissions!
Productivity/developer AI
브라우저에서 라온시큐어의 PC보안 기능을 사용하기 위한 확장 프로그램입니다.
Productivity/developer
Adds React debugging tools to the Chrome Developer Tools. Created from revision 3cde211b0c on 10/20/2025.
Productivity/developer