diff --git a/packages/design-system/src/tokens/ods/size.yaml b/packages/design-system/src/tokens/ods/size.yaml
index e7223aaee32..1ac18295e8a 100644
--- a/packages/design-system/src/tokens/ods/size.yaml
+++ b/packages/design-system/src/tokens/ods/size.yaml
@@ -23,7 +23,7 @@ size:
   form-check-default:
     value: 14px
   tiles:
-    resizeable:
+    resize-step:
       value: 12rem
     default:
       value: 14rem
diff --git a/packages/web-app-files/src/components/AppBar/ViewOptions.vue b/packages/web-app-files/src/components/AppBar/ViewOptions.vue
index fa5cb48c7a1..8248ee31ac7 100644
--- a/packages/web-app-files/src/components/AppBar/ViewOptions.vue
+++ b/packages/web-app-files/src/components/AppBar/ViewOptions.vue
@@ -108,7 +108,7 @@ export default defineComponent({
     })
     const viewSizeQuery = useRouteQueryPersisted({
       name: ViewModeConstants.tilesSizeQueryName,
-      defaultValue: ViewModeConstants.tilesSizeDefault
+      defaultValue: ViewModeConstants.tilesSizeDefault.toString()
     })
     watch(
       [perPageQuery, viewModeQuery],
@@ -163,7 +163,7 @@ export default defineComponent({
     setTilesViewSize() {
       document
         .querySelector(':root')
-        .style.setProperty(`--oc-size-tiles-resizeable`, `${this.viewSizeCurrent * 12}rem`)
+        .style.setProperty(`--oc-size-tiles-resize-step`, `${this.viewSizeCurrent * 12}rem`)
     },
     updateHiddenFilesShownModel(event) {
       this.hiddenFilesShownModel = event
diff --git a/packages/web-app-files/src/components/FilesList/ResourceTiles.vue b/packages/web-app-files/src/components/FilesList/ResourceTiles.vue
index ea6fd491f36..149e18a825a 100644
--- a/packages/web-app-files/src/components/FilesList/ResourceTiles.vue
+++ b/packages/web-app-files/src/components/FilesList/ResourceTiles.vue
@@ -215,7 +215,7 @@ export default defineComponent({
   row-gap: 1rem;
 
   &.resizeableTiles {
-    grid-template-columns: repeat(auto-fill, var(--oc-size-tiles-resizeable));
+    grid-template-columns: repeat(auto-fill, var(--oc-size-tiles-resize-step));
   }
 
   @media only screen and (max-width: 640px) {
diff --git a/packages/web-app-files/src/composables/viewMode/constants.ts b/packages/web-app-files/src/composables/viewMode/constants.ts
index 6819e466927..7e2b75da88b 100644
--- a/packages/web-app-files/src/composables/viewMode/constants.ts
+++ b/packages/web-app-files/src/composables/viewMode/constants.ts
@@ -31,6 +31,6 @@ export abstract class ViewModeConstants {
     }
   }
   static readonly queryName: string = 'view-mode'
-  static readonly tilesSizeDefault: string = '12rem'
+  static readonly tilesSizeDefault: number = 1
   static readonly tilesSizeQueryName: string = 'tiles-size'
 }
diff --git a/packages/web-app-files/src/composables/viewMode/useViewMode.ts b/packages/web-app-files/src/composables/viewMode/useViewMode.ts
index 2bec5f4272b..845ed8d0142 100644
--- a/packages/web-app-files/src/composables/viewMode/useViewMode.ts
+++ b/packages/web-app-files/src/composables/viewMode/useViewMode.ts
@@ -22,7 +22,7 @@ export function useViewSize<T>(options: ComputedRef<string>): ComputedRef<string
 
   const viewModeSize = useRouteQueryPersisted({
     name: ViewModeConstants.tilesSizeQueryName,
-    defaultValue: ViewModeConstants.tilesSizeDefault
+    defaultValue: ViewModeConstants.tilesSizeDefault.toString()
   })
   return computed(() => String(unref(viewModeSize)))
 }