diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index db01285..183c01f 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -51,6 +51,7 @@ import AppHeader from '@/components/AppHeader.vue'
 import AppDrawer from '@/components/AppDrawer.vue'
 import { meteoApi } from '@/api/meteo'
 import { settingsApi, type DebugSystemStats } from '@/api/settings'
+import { applyUiSizesToRoot } from '@/utils/uiSizeDefaults'
 
 const drawerOpen = ref(false)
 const debugMode = ref(localStorage.getItem('debug_mode') === '1')
@@ -124,13 +125,7 @@ function startDebugPolling() {
 }
 
 function applyUiSizesFromSettings(data: Record<string, string>) {
-  const defaults: Record<string, number> = { ui_font_size: 14, ui_menu_font_size: 13, ui_menu_icon_size: 18, ui_thumb_size: 96 }
-  const root = document.documentElement
-  for (const [key, def] of Object.entries(defaults)) {
-    const val = Number(data[key]) || def
-    const prop = '--' + key.replace(/_/g, '-')
-    root.style.setProperty(prop, `${val}px`)
-  }
+  applyUiSizesToRoot(data)
 }
 
 async function loadDebugModeFromApi() {
diff --git a/frontend/src/utils/uiSizeDefaults.ts b/frontend/src/utils/uiSizeDefaults.ts
new file mode 100644
index 0000000..1e42c19
--- /dev/null
+++ b/frontend/src/utils/uiSizeDefaults.ts
@@ -0,0 +1,15 @@
+export const UI_SIZE_DEFAULTS: Record<string, number> = {
+  ui_font_size: 14,
+  ui_menu_font_size: 13,
+  ui_menu_icon_size: 18,
+  ui_thumb_size: 96,
+}
+
+export function applyUiSizesToRoot(data: Record<string, string | number>): void {
+  const root = document.documentElement
+  for (const [key, def] of Object.entries(UI_SIZE_DEFAULTS)) {
+    const val = Number(data[key]) || def
+    const prop = '--' + key.replace(/_/g, '-')
+    root.style.setProperty(prop, `${val}px`)
+  }
+}
diff --git a/frontend/src/views/ReglagesView.vue b/frontend/src/views/ReglagesView.vue
index da8f4da..56c23c6 100644
--- a/frontend/src/views/ReglagesView.vue
+++ b/frontend/src/views/ReglagesView.vue
@@ -118,6 +118,7 @@
 import { onMounted, ref } from 'vue'
 import { settingsApi } from '@/api/settings'
 import { meteoApi } from '@/api/meteo'
+import { UI_SIZE_DEFAULTS, applyUiSizesToRoot } from '@/utils/uiSizeDefaults'
 
 const debugMode = ref(false)
 const saving = ref(false)
@@ -128,13 +129,6 @@ const backupMsg = ref('')
 const apiBaseUrl = detectApiBaseUrl()
 
 // --- UI Size settings ---
-const UI_DEFAULTS: Record<string, number> = {
-  ui_font_size: 14,
-  ui_menu_font_size: 13,
-  ui_menu_icon_size: 18,
-  ui_thumb_size: 96,
-}
-
 const uiSizeSettings = [
   { key: 'ui_font_size',      label: 'Taille texte',            min: 12, max: 20,  step: 1, unit: 'px' },
   { key: 'ui_menu_font_size', label: 'Texte menu latéral',      min: 11, max: 18,  step: 1, unit: 'px' },
@@ -142,16 +136,12 @@ const uiSizeSettings = [
   { key: 'ui_thumb_size',     label: 'Miniatures images/vidéo', min: 60, max: 200, step: 4, unit: 'px' },
 ]
 
-const uiSizes = ref<Record<string, number>>({ ...UI_DEFAULTS })
+const uiSizes = ref<Record<string, number>>({ ...UI_SIZE_DEFAULTS })
 const savingUi = ref(false)
 const uiSavedMsg = ref('')
 
 function applyUiSizes() {
-  const root = document.documentElement
-  root.style.setProperty('--ui-font-size',      `${uiSizes.value.ui_font_size}px`)
-  root.style.setProperty('--ui-menu-font-size', `${uiSizes.value.ui_menu_font_size}px`)
-  root.style.setProperty('--ui-menu-icon-size', `${uiSizes.value.ui_menu_icon_size}px`)
-  root.style.setProperty('--ui-thumb-size',     `${uiSizes.value.ui_thumb_size}px`)
+  applyUiSizesToRoot(uiSizes.value)
   window.dispatchEvent(new CustomEvent('ui-sizes-updated', { detail: { ...uiSizes.value } }))
 }
 
@@ -165,13 +155,16 @@ async function saveUiSettings() {
     applyUiSizes()
     uiSavedMsg.value = 'Enregistré'
     setTimeout(() => { uiSavedMsg.value = '' }, 1800)
+  } catch {
+    uiSavedMsg.value = 'Erreur lors de l\'enregistrement.'
+    setTimeout(() => { uiSavedMsg.value = '' }, 2200)
   } finally {
     savingUi.value = false
   }
 }
 
 function resetUiSettings() {
-  uiSizes.value = { ...UI_DEFAULTS }
+  uiSizes.value = { ...UI_SIZE_DEFAULTS }
   applyUiSizes()
 }
 
@@ -226,7 +219,7 @@ async function loadSettings() {
     notifyDebugChanged(debugMode.value)
     for (const s of uiSizeSettings) {
       const v = data[s.key]
-      if (v != null) uiSizes.value[s.key] = Number(v) || UI_DEFAULTS[s.key]
+      if (v != null) uiSizes.value[s.key] = Number(v) || UI_SIZE_DEFAULTS[s.key]
     }
     applyUiSizes()
   } catch {