diff --git a/web-app/src/routes/hub/index.tsx b/web-app/src/routes/hub/index.tsx
index 5e43cc70e..7004f356e 100644
--- a/web-app/src/routes/hub/index.tsx
+++ b/web-app/src/routes/hub/index.tsx
@@ -287,8 +287,8 @@ function Hub() {
 
       const handleDownload = () => {
         // Immediately set local downloading state
-        addLocalDownloadingModel(modelId)
-        pullModel(modelId, modelUrl)
+        addLocalDownloadingModel(modelId.replace(/[^a-zA-Z0-9/_\-.]/g, ''))
+        pullModel(modelId.replace(/[^a-zA-Z0-9/_\-.]/g, ''), modelUrl)
       }
 
       return (
diff --git a/web-app/src/services/models.ts b/web-app/src/services/models.ts
index 50b1c0ebc..d4156dc98 100644
--- a/web-app/src/services/models.ts
+++ b/web-app/src/services/models.ts
@@ -162,7 +162,9 @@ export const convertHfRepoToCatalogModel = (
     }
 
     // Generate model_id from filename (remove .gguf extension, case-insensitive)
-    const modelId = file.rfilename.replace(/\.gguf$/i, '')
+    const modelId = file.rfilename
+      .replace(/\.gguf$/i, '')
+      .replace(/[^a-zA-Z0-9/_\-.]/g, '')
 
     return {
       model_id: modelId,