diff --git a/src/hooks/useSearchQuery.ts b/src/hooks/useSearchQuery.ts
index 425fe4f1..93cfad49 100644
--- a/src/hooks/useSearchQuery.ts
+++ b/src/hooks/useSearchQuery.ts
@@ -27,7 +27,7 @@ export function useSearchQuery(): [
     }
     navigate(
       generatePath("/browse/:query", {
-        query: inp,
+        query: encodeURIComponent(inp),
       }),
       { replace: true },
     );
diff --git a/src/setup/App.tsx b/src/setup/App.tsx
index cfc49df3..ad08441c 100644
--- a/src/setup/App.tsx
+++ b/src/setup/App.tsx
@@ -90,7 +90,7 @@ function QueryView() {
 
   useEffect(() => {
     if (query) {
-      navigate(`/browse/${query}`, { replace: true });
+      navigate(`/browse/${encodeURIComponent(query)}`, { replace: true });
     } else {
       navigate("/", { replace: true });
     }
diff --git a/src/utils/setup/App.tsx b/src/utils/setup/App.tsx
index e3cd4100..7e54a4a5 100644
--- a/src/utils/setup/App.tsx
+++ b/src/utils/setup/App.tsx
@@ -77,7 +77,7 @@ function QueryView() {
 
   useEffect(() => {
     if (query) {
-      navigate(`/browse/${query}`, { replace: true });
+      navigate(`/browse/${encodeURIComponent(query)}`, { replace: true });
     } else {
       navigate("/", { replace: true });
     }