From 1737dea043faff24584b62cd5741c126b3e43ac8 Mon Sep 17 00:00:00 2001
From: Amir Afshar <mr.afshar0@gmail.com>
Date: Fri, 29 Aug 2025 23:28:29 +0330
Subject: [PATCH] chore(docs): add example for densities prop usage

---
 docs/content/2.usage/1.nuxt-img.md | 23 +++++++++++++++--------
 1 file changed, 15 insertions(+), 8 deletions(-)

diff --git a/docs/content/2.usage/1.nuxt-img.md b/docs/content/2.usage/1.nuxt-img.md
index 96c1618ca..5707a30c1 100644
--- a/docs/content/2.usage/1.nuxt-img.md
+++ b/docs/content/2.usage/1.nuxt-img.md
@@ -134,23 +134,30 @@ By default Nuxt generates *responsive-first* sizing.
 
 ### `densities`
 
-To generate special versions of images for screens with increased pixel density.
+The `densities` prop serves high-resolution images for Retina/HiDPI screens.
+
+Nuxt Image generates multiple versions at different pixel densities and creates the appropriate `srcset`.
+
+When you specify densities, Nuxt Image multiplies your base dimensions by each density value to generate the corresponding image sizes.
 
 **Example:**
 
 ```vue
-<NuxtImg
-  src="/logos/nuxt.png"
+<!-- Small icon, sharp on all screen densities -->
+<NuxtImg 
+  src="/nuxt.png"
   height="50"
   densities="x1 x2"
 />
-
-<!--
+```
+Will result in:
+```html
+<!-- Rendered HTML -->
 <img
-  src="/_ipx/w_50/logos/nuxt.png" 
-  srcset="/_ipx/w_100/logos/nuxt.png x2"
+  src="/_ipx/w_50/nuxt.png"
+  srcset="/_ipx/w_50/nuxt.png 1x,
+          /_ipx/w_100/nuxt.png 2x"
 />
--->
 ```
 
 ### `placeholder`