diff --git a/adev/src/assets/images/guide/devtools/di-injector-tree-providers.png b/adev/src/assets/images/guide/devtools/di-injector-tree-providers.png
new file mode 100644
index 0000000000000..794d413f39106
Binary files /dev/null and b/adev/src/assets/images/guide/devtools/di-injector-tree-providers.png differ
diff --git a/adev/src/assets/images/guide/devtools/di-injector-tree-selected.png b/adev/src/assets/images/guide/devtools/di-injector-tree-selected.png
new file mode 100644
index 0000000000000..6da211b5e6dcb
Binary files /dev/null and b/adev/src/assets/images/guide/devtools/di-injector-tree-selected.png differ
diff --git a/adev/src/assets/images/guide/devtools/di-injector-tree.png b/adev/src/assets/images/guide/devtools/di-injector-tree.png
new file mode 100644
index 0000000000000..dbcf522ec2d6f
Binary files /dev/null and b/adev/src/assets/images/guide/devtools/di-injector-tree.png differ
diff --git a/adev/src/content/tools/devtools.md b/adev/src/content/tools/devtools.md
index 1b7dcaf156d6f..6ac0bb2e42ffe 100644
--- a/adev/src/content/tools/devtools.md
+++ b/adev/src/content/tools/devtools.md
@@ -170,3 +170,27 @@ Click the **Save Profile** button at the top-right of a recorded profiling sessi
 Later, import the file in the initial view of the profiler by clicking the **Choose file** input.
 
 <img src="assets/images/guide/devtools/save-profile.png" alt="A screenshot of the 'Profiler' tab displaying change detection cycles. On the right side a 'Save Profile' button is visible.">
+
+ ## Inspect your injectors
+
+ Note: The Injector Tree is available for Angular Applications built with version 17 or higher.
+
+### View the injector hierarchy of your application
+
+ The **Injector Tree** tab lets you explore the structure of the Injectors configured in your application. Here you will see two trees representing the [injector hierarchy](guide/di/hierarchical-dependency-injection) of your application. One tree is your environment hierarchy, the other is your element hierarchy.
+
+<img src="assets/images/guide/devtools/di-injector-tree.png" alt="A screenshot of the 'Profiler' tab displaying the injector tree tab in Angular Devtools visualizing the injector graph for an example application.">
+
+ ### Visualize resolution paths
+
+ When a specific injector is selected, the path that Angular's dependency injection algorithm traverses from that injector to the root is highlighted. For element injectors, this includes highlighting the environment injectors that the dependency injection algorithm jumps to when a dependency cannot be resolved in the element hierarchy.
+
+See [resolution rules](guide/di/hierarchical-dependency-injection#resolution-rules) for more details about how Angular resolves resolution paths. 
+
+<img src="assets/images/guide/devtools/di-injector-tree-selected.png" alt="A screenshot of the 'Profiler' tab displaying how the injector tree visualize highlights resolution paths when an injector is selected.">
+
+ ### View injector providers
+
+ Clicking an injector that has configured providers will display those providers in a list on the right of the injector tree view. Here you can view the provided token and it's type.
+
+<img src="assets/images/guide/devtools/di-injector-tree-providers.png" alt="A screenshot of the 'Profiler' tab displaying how providers are made visible when an injector is selected.">