diff --git a/app/src/app.tsx b/app/src/app.tsx
index e01a788..a6ba7d8 100644
--- a/app/src/app.tsx
+++ b/app/src/app.tsx
@@ -38,7 +38,9 @@ export default () => {
         <a href="/new">📄</a>
       </header>
       {routes[pathname()] ?? (
-        <Page id={Number(pathname().slice(1)) || random()} />
+        <Page
+          id={parseInt(pathname().slice(1), 16) || random()}
+        />
       )}
     </>
   );
diff --git a/app/src/helpers/random.ts b/app/src/helpers/random.ts
index 94f9e8e..34d9d0b 100644
--- a/app/src/helpers/random.ts
+++ b/app/src/helpers/random.ts
@@ -1,5 +1,5 @@
 function random(): number {
-  return window.crypto.getRandomValues(new Uint16Array(1))[0]!;
+  return 0x7f_ff_ff_ff & window.crypto.getRandomValues(new Uint32Array(1))[0]!;
 }
 
 export default random;
diff --git a/app/src/pages/index.tsx b/app/src/pages/index.tsx
index 84590f9..ce669f3 100644
--- a/app/src/pages/index.tsx
+++ b/app/src/pages/index.tsx
@@ -20,7 +20,7 @@ export default () => {
         <Cards>
           <For each={pages()}>
             {(page) => (
-              <a href={`/${page.id}`}>
+              <a href={`/${page.id.toString(16)}`}>
                 <Card {...page} />
               </a>
             )}
diff --git a/app/src/pages/page.tsx b/app/src/pages/page.tsx
index ccc1596..9cab838 100644
--- a/app/src/pages/page.tsx
+++ b/app/src/pages/page.tsx
@@ -44,7 +44,11 @@ export default (props: { id: number }) => {
     async (id: number, content: Pages.RequestContentPage) => {
       if (await (content.text ? updatePage(id, content) : deletePage(id))) {
         unblock();
-        window.history.replaceState({}, "", `/${content.text ? id : "new"}`);
+        window.history.replaceState(
+          {},
+          "",
+          `/${content.text ? id.toString(16) : "new"}`
+        );
       }
     },
     intervalMs