diff --git a/crates/ezidam/src/menu/items/user.rs b/crates/ezidam/src/menu/items/user.rs
index d9b2dbf..e7c56ea 100644
--- a/crates/ezidam/src/menu/items/user.rs
+++ b/crates/ezidam/src/menu/items/user.rs
@@ -38,6 +38,10 @@ impl UserMenu {
                         label: "Security",
                         link: uri!(routes::settings::security::user_settings_security).to_string(),
                     },
+                    SubItem {
+                        label: "Visual",
+                        link: uri!(routes::settings::visual::user_settings_visual).to_string(),
+                    },
                 ]),
             },
         ]
diff --git a/crates/ezidam/src/page.rs b/crates/ezidam/src/page.rs
index 1f38779..f1d67ab 100644
--- a/crates/ezidam/src/page.rs
+++ b/crates/ezidam/src/page.rs
@@ -23,6 +23,7 @@ pub enum Page {
     AdminAppsView(AdminAppsView),
     UserPersonalSettings(UserPersonalSettings),
     UserSecuritySettings(UserSecuritySettings),
+    UserVisualSettings(UserVisualSettings),
 }
 
 impl Page {
@@ -42,6 +43,7 @@ impl Page {
             Page::AdminAppsView(_) => "pages/admin/apps/view",
             Page::UserPersonalSettings(_) => "pages/settings/personal",
             Page::UserSecuritySettings(_) => "pages/settings/security",
+            Page::UserVisualSettings(_) => "pages/settings/visual",
         }
     }
 
@@ -61,6 +63,7 @@ impl Page {
             Page::AdminAppsView(_) => "Application info",
             Page::UserPersonalSettings(_) => "Personal settings",
             Page::UserSecuritySettings(_) => "Security settings",
+            Page::UserVisualSettings(_) => "Visual settings",
         }
     }
 
@@ -82,6 +85,7 @@ impl Page {
             Page::AdminAppsView(_) => Some(AdminMenu::Apps.into()),
             Page::UserPersonalSettings(_) => Some(UserMenu::Settings.into()),
             Page::UserSecuritySettings(_) => Some(UserMenu::Settings.into()),
+            Page::UserVisualSettings(_) => Some(UserMenu::Settings.into()),
         }
     }
 
@@ -101,6 +105,7 @@ impl Page {
             Page::AdminAppsView(view) => Box::new(view),
             Page::UserPersonalSettings(personal) => Box::new(personal),
             Page::UserSecuritySettings(security) => Box::new(security),
+            Page::UserVisualSettings(visual) => Box::new(visual),
         }
     }
 }
diff --git a/crates/ezidam/src/routes/settings.rs b/crates/ezidam/src/routes/settings.rs
index 02b5b53..49cac3f 100644
--- a/crates/ezidam/src/routes/settings.rs
+++ b/crates/ezidam/src/routes/settings.rs
@@ -2,9 +2,11 @@ use super::prelude::*;
 use personal::*;
 use rocket::get;
 use security::*;
+use visual::*;
 
 pub mod personal;
 pub mod security;
+pub mod visual;
 
 pub fn routes() -> Vec<Route> {
     routes![
@@ -15,6 +17,7 @@ pub fn routes() -> Vec<Route> {
         user_settings_security_logout_everywhere,
         user_settings_security_paper_key,
         user_settings_security_password,
+        user_settings_visual,
     ]
 }
 
@@ -44,4 +47,11 @@ pub mod content {
         pub user: JwtClaims,
         pub logout_time_effective: i64,
     }
+
+    #[derive(Serialize)]
+    #[serde(crate = "rocket::serde")]
+    #[derive(Clone)]
+    pub struct UserVisualSettings {
+        pub user: JwtClaims,
+    }
 }
diff --git a/crates/ezidam/src/routes/settings/visual.rs b/crates/ezidam/src/routes/settings/visual.rs
new file mode 100644
index 0000000..7b622c1
--- /dev/null
+++ b/crates/ezidam/src/routes/settings/visual.rs
@@ -0,0 +1,7 @@
+use crate::routes::prelude::*;
+use rocket::get;
+
+#[get("/settings/visual")]
+pub async fn user_settings_visual(jwt_user: JwtUser) -> Page {
+    Page::UserVisualSettings(super::content::UserVisualSettings { user: jwt_user.0 })
+}
diff --git a/crates/ezidam/templates/pages/settings/personal.html.tera b/crates/ezidam/templates/pages/settings/personal.html.tera
index a49e651..4bb4997 100644
--- a/crates/ezidam/templates/pages/settings/personal.html.tera
+++ b/crates/ezidam/templates/pages/settings/personal.html.tera
@@ -32,6 +32,8 @@
                                class="list-group-item list-group-item-action d-flex align-items-center active">Personal</a>
                             <a href="./security"
                                class="list-group-item list-group-item-action d-flex align-items-center">Security</a>
+                            <a href="./visual"
+                               class="list-group-item list-group-item-action d-flex align-items-center">Visual</a>
                         </div>
                     </div>
                 </div>
diff --git a/crates/ezidam/templates/pages/settings/security.html.tera b/crates/ezidam/templates/pages/settings/security.html.tera
index 95a0046..428f45e 100644
--- a/crates/ezidam/templates/pages/settings/security.html.tera
+++ b/crates/ezidam/templates/pages/settings/security.html.tera
@@ -32,6 +32,8 @@
                                class="list-group-item list-group-item-action d-flex align-items-center">Personal</a>
                             <a href="./security"
                                class="list-group-item list-group-item-action d-flex align-items-center active">Security</a>
+                            <a href="./visual"
+                               class="list-group-item list-group-item-action d-flex align-items-center">Visual</a>
                         </div>
                     </div>
                 </div>
diff --git a/crates/ezidam/templates/pages/settings/visual.html.tera b/crates/ezidam/templates/pages/settings/visual.html.tera
new file mode 100644
index 0000000..9d7489a
--- /dev/null
+++ b/crates/ezidam/templates/pages/settings/visual.html.tera
@@ -0,0 +1,61 @@
+{% extends "shell" %}
+
+{% block content %}
+<!-- Page header -->
+<div class="page-header d-print-none">
+    <div class="container-xl">
+        <div class="row g-2 align-items-center">
+            <div class="col">
+                <h2 class="page-title">
+                    Settings
+                </h2>
+            </div>
+        </div>
+    </div>
+</div>
+<!-- Page body -->
+<div class="page-body">
+    <div class="container-xl">
+
+        {% if flash %}
+        <div class="alert alert-{{flash.0}}" role="alert">
+            <h4 class="alert-title">{{ flash.1 | safe }}</h4>
+        </div>
+        {% endif %}
+
+        <div class="card">
+            <div class="row g-0">
+                <div class="col-3 d-none d-md-block border-end">
+                    <div class="card-body">
+                        <div class="list-group list-group-transparent">
+                            <a href="./personal"
+                               class="list-group-item list-group-item-action d-flex align-items-center">Personal</a>
+                            <a href="./security"
+                               class="list-group-item list-group-item-action d-flex align-items-center">Security</a>
+                            <a href="./visual"
+                               class="list-group-item list-group-item-action d-flex align-items-center active">Visual</a>
+                        </div>
+                    </div>
+                </div>
+                <div class="col d-flex flex-column">
+                    <div class="card-body">
+                        <h2 class="mb-4">Visual</h2>
+
+                        <a href="?theme=dark" class="btn hide-theme-dark">
+                            {% include "icons/moon" %}
+                            Enable dark mode
+                        </a>
+
+                        <a href="?theme=light" class="btn hide-theme-light">
+                            {% include "icons/sun" %}
+                            Enable light mode
+                        </a>
+
+                    </div>
+
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock content %}
diff --git a/crates/ezidam/templates/shell/header.html.tera b/crates/ezidam/templates/shell/header.html.tera
index 5985c54..4f23f15 100644
--- a/crates/ezidam/templates/shell/header.html.tera
+++ b/crates/ezidam/templates/shell/header.html.tera
@@ -8,18 +8,6 @@
             {% include "utils/logo_header" %}
         </h1>
         <div class="navbar-nav flex-row order-md-last">
-            <div class="d-none d-md-flex me-3">
-                <a href="?theme=dark" class="nav-link px-0 hide-theme-dark" title="Enable dark mode"
-                   data-bs-toggle="tooltip"
-                   data-bs-placement="bottom">
-                    {% include "icons/moon" %}
-                </a>
-                <a href="?theme=light" class="nav-link px-0 hide-theme-light" title="Enable light mode"
-                   data-bs-toggle="tooltip"
-                   data-bs-placement="bottom">
-                    {% include "icons/sun" %}
-                </a>
-            </div>
             <div class="nav-item dropdown">
                 <a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown"
                    aria-label="Open user menu">