diff --git a/packages/sync/src/useMutliplayerDemo.ts b/packages/sync/src/useMutliplayerDemo.ts
index c8ec4893c..dff6bb9e9 100644
--- a/packages/sync/src/useMutliplayerDemo.ts
+++ b/packages/sync/src/useMutliplayerDemo.ts
@@ -50,7 +50,7 @@ export function useMultiplayerDemo({
 	const assets = useMemo(() => createDemoAssetStore(host), [host])
 
 	return useMultiplayerSync({
-		uri: `${host}/connect/${roomId}`,
+		uri: `${host}/connect/${encodeURIComponent(roomId)}`,
 		roomId,
 		userPreferences,
 		assets,