diff --git a/apps/docs/docs/widgets/beszel-system-stats/img/beszel-system-stats.png b/apps/docs/docs/widgets/beszel-system-stats/img/beszel-system-stats.png
index 78177d7e7..d73b5d004 100644
Binary files a/apps/docs/docs/widgets/beszel-system-stats/img/beszel-system-stats.png and b/apps/docs/docs/widgets/beszel-system-stats/img/beszel-system-stats.png differ
diff --git a/apps/docs/docs/widgets/calendar/img/advanced-view.png b/apps/docs/docs/widgets/calendar/img/advanced-view.png
new file mode 100644
index 000000000..a17186774
Binary files /dev/null and b/apps/docs/docs/widgets/calendar/img/advanced-view.png differ
diff --git a/apps/docs/docs/widgets/calendar/img/current-view.png b/apps/docs/docs/widgets/calendar/img/current-view.png
new file mode 100644
index 000000000..0441e45e1
Binary files /dev/null and b/apps/docs/docs/widgets/calendar/img/current-view.png differ
diff --git a/apps/docs/docs/widgets/calendar/index.mdx b/apps/docs/docs/widgets/calendar/index.mdx
index c6b7397a6..7bb798997 100644
--- a/apps/docs/docs/widgets/calendar/index.mdx
+++ b/apps/docs/docs/widgets/calendar/index.mdx
@@ -31,16 +31,12 @@ the same data is requested through Homarr's MCP or Assistant tools.
 
 ### Screenshots
 
-import popover from "./img/popover.png";
-import withIntegrations from "./img/with-integrations.png";
-import withoutIntegrations from "./img/without-integrations.png";
+import currentView from "./img/current-view.png";
+import advancedView from "./img/advanced-view.png";
 
-<div className="flex gap-1">
-  <img src={withIntegrations} alt="calendar with-integrations big-size" width={256 + 4} height={256 + 4} />
-  <div className="flex flex-col gap-1">
-    <img src={popover} alt="calendar popover-details the-mandalorian" width={128 * 3} height={128} />
-    <img src={withoutIntegrations} alt="calendar without-integrations small-size" width={256} height={128} />
-  </div>
+<div className="flex flex-col gap-1">
+  <img src={currentView} alt="Calendar month view with marked events" width={513} height={303} />
+  <img src={advancedView} alt="Calendar advanced view with grouped events" width={800} height={484} />
 </div>
 
 ### Supported Integrations
diff --git a/apps/docs/docs/widgets/docker-containers/img/table.png b/apps/docs/docs/widgets/docker-containers/img/table.png
index ff5aa337a..43ad6a279 100644
Binary files a/apps/docs/docs/widgets/docker-containers/img/table.png and b/apps/docs/docs/widgets/docker-containers/img/table.png differ
diff --git a/apps/docs/docs/widgets/media-server/img/advanced-view.png b/apps/docs/docs/widgets/media-server/img/advanced-view.png
new file mode 100644
index 000000000..75a49a3a2
Binary files /dev/null and b/apps/docs/docs/widgets/media-server/img/advanced-view.png differ
diff --git a/apps/docs/docs/widgets/media-server/img/table.png b/apps/docs/docs/widgets/media-server/img/table.png
index d8153d22f..9100a7a8c 100644
Binary files a/apps/docs/docs/widgets/media-server/img/table.png and b/apps/docs/docs/widgets/media-server/img/table.png differ
diff --git a/apps/docs/docs/widgets/media-server/index.mdx b/apps/docs/docs/widgets/media-server/index.mdx
index 07b83761e..08a2b9d97 100644
--- a/apps/docs/docs/widgets/media-server/index.mdx
+++ b/apps/docs/docs/widgets/media-server/index.mdx
@@ -31,8 +31,12 @@ Sessions without user metadata remain visible and are labeled as an unknown user
 ### Screenshots
 
 import mediaTable from "./img/table.png";
+import mediaAdvancedView from "./img/advanced-view.png";
 
-<img src={mediaTable} alt="media-server-streams" width={128 * 3 * 1.5} height={128 * 1.5} />
+<div className="flex flex-col gap-1">
+  <img src={mediaTable} alt="Media server compact streams table" width={303} height={198} />
+  <img src={mediaAdvancedView} alt="Media server advanced view with stream summary" width={800} height={484} />
+</div>
 
 ### Supported Integrations
 
diff --git a/apps/docs/docs/widgets/weather/img/advanced-view.png b/apps/docs/docs/widgets/weather/img/advanced-view.png
new file mode 100644
index 000000000..96e37daf4
Binary files /dev/null and b/apps/docs/docs/widgets/weather/img/advanced-view.png differ
diff --git a/apps/docs/docs/widgets/weather/img/current.png b/apps/docs/docs/widgets/weather/img/current.png
index 45cc08169..24584a40e 100644
Binary files a/apps/docs/docs/widgets/weather/img/current.png and b/apps/docs/docs/widgets/weather/img/current.png differ
diff --git a/apps/docs/docs/widgets/weather/img/forecast.png b/apps/docs/docs/widgets/weather/img/forecast.png
index 2de9b1224..43a7dd833 100644
Binary files a/apps/docs/docs/widgets/weather/img/forecast.png and b/apps/docs/docs/widgets/weather/img/forecast.png differ
diff --git a/apps/docs/docs/widgets/weather/index.mdx b/apps/docs/docs/widgets/weather/index.mdx
index 0ab2e12b4..f64f5d754 100644
--- a/apps/docs/docs/widgets/weather/index.mdx
+++ b/apps/docs/docs/widgets/weather/index.mdx
@@ -23,10 +23,12 @@ Meteo response.
 
 import forecastWeather from "./img/forecast.png";
 import currentWeather from "./img/current.png";
+import advancedWeather from "./img/advanced-view.png";
 
 <div className="flex flex-col gap-1">
-  <img src={forecastWeather} alt="weather forecast-5-days" width={128 * 4.5} />
-  <img src={currentWeather} alt="weather current" width={128 * 3} />
+  <img src={forecastWeather} alt="Weather compact forecast" width={238} height={112} />
+  <img src={currentWeather} alt="Weather compact current conditions" width={198} height={93} />
+  <img src={advancedWeather} alt="Weather advanced view with seven-day forecast details" width={800} height={484} />
 </div>
 
 <WidgetInteractionGuide />