diff --git a/apps/stage-tamagotchi/src/renderer/src/pages/settings/providers/index.vue b/apps/stage-tamagotchi/src/renderer/src/pages/settings/providers/index.vue
index 25ca1a486..ba23f16ef 100644
--- a/apps/stage-tamagotchi/src/renderer/src/pages/settings/providers/index.vue
+++ b/apps/stage-tamagotchi/src/renderer/src/pages/settings/providers/index.vue
@@ -23,7 +23,7 @@ const { allProvidersMetadata } = storeToRefs(providersStore)
       </div>
     </h1>
   </div>
-  <div grid="~ cols-2 gap-2">
+  <div grid="~ cols-2 gap-4">
     <IconStatusItem
       v-for="provider in allProvidersMetadata"
       :key="provider.id"
diff --git a/apps/stage-web/src/layouts/default.vue b/apps/stage-web/src/layouts/default.vue
index fd507333d..ede3b7851 100644
--- a/apps/stage-web/src/layouts/default.vue
+++ b/apps/stage-web/src/layouts/default.vue
@@ -20,7 +20,7 @@ const { top, right, bottom, left } = useScreenSafeArea()
     <div mb-4 w-full gap-2 class="px-0 py-1 md:px-3 md:py-3">
       <HeaderLink />
     </div>
-    <div class="px-3 py-2 md:px-5 md:py-5" flex="~ col gap-4">
+    <div class="px-3 py-2 md:px-5 md:py-5" flex="~ col gap-4" mx-auto max-w-screen-lg>
       <RouterView />
     </div>
   </div>
diff --git a/apps/stage-web/src/pages/settings/providers/index.vue b/apps/stage-web/src/pages/settings/providers/index.vue
index 686b0c439..260255576 100644
--- a/apps/stage-web/src/pages/settings/providers/index.vue
+++ b/apps/stage-web/src/pages/settings/providers/index.vue
@@ -23,7 +23,7 @@ const { allProvidersMetadata } = storeToRefs(providersStore)
       </div>
     </h1>
   </div>
-  <div grid="~ cols-2 gap-2">
+  <div grid="~ cols-2 gap-4">
     <IconStatusItem
       v-for="provider in allProvidersMetadata"
       :key="provider.id"