diff --git a/README.md b/README.md
index 7abdd2e..85a532c 100644
--- a/README.md
+++ b/README.md
@@ -15,7 +15,7 @@
 - **Dashboard:** statistics (open tasks, deadlines, completion %).
 - **Settings:** update profile or change password (new ≠ old).
 - **Authentication:** JWT-based login/registration with refresh support.
-
+- 🌙 **Dark / Light Mode:** automatic theme switching with manual toggle
 ---
 
 ## 🛠 Tech Stack
@@ -150,6 +150,14 @@ src/test/java/dev/taskraum/backend
 
 ## 🖼 Screenshots
 
+## Homepage - Light
+
+![Homepage_Light](./docs/screenshots/Homepage_Light.png)
+
+## Homepage - Dark
+
+![Homepage_Dark](./docs/screenshots/Homepage_Dark.png)
+
 ### Dashboard
 
 ![Dashboard](./docs/screenshots/1-Dashboard.png)  
diff --git a/docs/screenshots/Homepage_Dark.png b/docs/screenshots/Homepage_Dark.png
new file mode 100644
index 0000000..9a410a8
Binary files /dev/null and b/docs/screenshots/Homepage_Dark.png differ
diff --git a/docs/screenshots/Homepage_Light.png b/docs/screenshots/Homepage_Light.png
new file mode 100644
index 0000000..b4bd724
Binary files /dev/null and b/docs/screenshots/Homepage_Light.png differ
diff --git a/frontend/public/assets/screenshots/Homepage_Dark.png b/frontend/public/assets/screenshots/Homepage_Dark.png
new file mode 100644
index 0000000..9a410a8
Binary files /dev/null and b/frontend/public/assets/screenshots/Homepage_Dark.png differ
diff --git a/frontend/public/assets/screenshots/Homepage_Light.png b/frontend/public/assets/screenshots/Homepage_Light.png
new file mode 100644
index 0000000..b4bd724
Binary files /dev/null and b/frontend/public/assets/screenshots/Homepage_Light.png differ
diff --git a/frontend/src/pages/About/AboutPage.tsx b/frontend/src/pages/About/AboutPage.tsx
index 4b8cc65..e3380db 100644
--- a/frontend/src/pages/About/AboutPage.tsx
+++ b/frontend/src/pages/About/AboutPage.tsx
@@ -10,6 +10,8 @@ import AppFooter from "../../components/Layout/AppFooter";
 type Shot = { src: string; title: string };
 
 const screenshots: Shot[] = [
+    { src: "assets/screenshots/Homepage_Dark.png", title: "Homepage – Dark Mode"},
+    { src: "assets/screenshots/Homepage_Light.png", title: "Homepage – Light Mode"},
     { src: "assets/screenshots/Dashboard.png", title: "Dashboard – KPIs & Upcoming Deadlines" },
     { src: "assets/screenshots/Projects.png", title: "Projects – Active / Paused / Archived" },
     { src: "assets/screenshots/Tasks.png", title: "Tasks – Kanban with Drag & Drop" },
@@ -52,6 +54,8 @@ export default function AboutPage() {
             The bootcamp lasted 3 months, and <strong>this project was developed in 1 month</strong>.
             Tech: Spring Boot backend, React + TypeScript frontend. CRUD operations with a REST API and
             stateless, token-based security using JWT.
+            The app also supports a full dark theme using MUI’s theming. The color mode
+            is stored locally, so your choice persists.
         </Typography>
     );
 
@@ -63,7 +67,8 @@ export default function AboutPage() {
             </Link>.
             Das Bootcamp dauerte 3 Monate; <strong>die Entwicklung dieses Projekts erfolgte in 1 Monat</strong>.
             Technologie: Spring Boot im Backend, React + TypeScript im Frontend. CRUD mit REST-API sowie
-            zustandslose, tokenbasierte Sicherheit per JWT.
+            zustandslose, tokenbasierte Sicherheit per JWT. Die App unterstützt ein vollständiges Dark Theme auf Basis des MUI-Themes.
+            Die Auswahl bleibt lokal gespeichert.
         </Typography>
     );
 
@@ -142,6 +147,10 @@ export default function AboutPage() {
                             <Typography>
                                 • <strong>Settings:</strong> Update profile name and change password.
                             </Typography>
+                            <Typography>
+                                • <strong>Dark Mode:</strong> One-click toggle in TopBar & User Menu; theme persists between visits.
+                                Calendar, cards, and dashboard metrics are tuned for readability in dark & light.
+                            </Typography>
                         </Stack>
 
                         {/* Screenshots */}