diff --git a/astro.config.mjs b/astro.config.mjs
index 9efff5a..bc7ed16 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -62,7 +62,6 @@ export default defineConfig({
     '/series/list': { status: 307, destination: '/maintenance' },
     '/studio/[slug]': { status: 307, destination: '/maintenance' },
     '/studio/list': { status: 307, destination: '/maintenance' },
-    '/holy12': { status: 307, destination: '/maintenance' },
     '/request': { status: 307, destination: '/maintenance' }
   },
   security: {
diff --git a/messages/en.json b/messages/en.json
index 0e3e919..87c78bb 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -75,5 +75,11 @@
   "discordRoleNeeded": "You need the Donator Discord role to access this page",
   "addedDonator": "Added donator benefits to your account!",
   "errorDonatorCheck": "Something went wrong when checking your Discord donator status. Please try again later. {error}",
-  "discordRateLimit": "{message} Retry after {retry_after} seconds."
+  "discordRateLimit": "{message} Retry after {retry_after} seconds.",
+  "holy12_0": "Cloud's secret mixtape",
+  "holy12_1": "Best romantic dinner BGM",
+  "holy12_2": "12 clicks till midnight",
+  "holy12_3": "We let our technicians pick these",
+  "holy12_4": "It's noisy outside, take one of these",
+  "holy12_5": "Silksong is hidden behind one of these"
 }
diff --git a/src/components/Sidebar.astro b/src/components/Sidebar.astro
index 144e8b7..f0d801e 100644
--- a/src/components/Sidebar.astro
+++ b/src/components/Sidebar.astro
@@ -20,7 +20,7 @@ const listClass =
 
 <div class='md:w-3/12 md:max-w-[300px] h-full bg-dark flex flex-col'>
   <a href='#' class={listClass}>{m.getLucky()}</a>
-  <a href='#' class={listClass}>{m.randomPull()}</a>
+  <a href='/holy12' class={listClass}>{m.randomPull()}</a>
   <div class='px-6 flex flex-col gap-y-3'>
     <SidebarSection class='flex flex-col gap-y-3'>
       <div class='flex gap-x-2 justify-center'>
diff --git a/src/pages/holy12.astro b/src/pages/holy12.astro
new file mode 100644
index 0000000..41c0319
--- /dev/null
+++ b/src/pages/holy12.astro
@@ -0,0 +1,42 @@
+---
+import * as m from 'paraglide/messages'
+import prismaClient from 'utils/prisma-client'
+
+import Base from 'layouts/base.astro'
+import { getRandom } from 'utils/form'
+import AlbumBox from 'components/AlbumBox.astro'
+
+async function getRandomAlbum(): Promise<{ id: number; title: string }> {
+  const res: { id: number; title: string }[] = await prismaClient.$queryRawUnsafe(`
+    SELECT r1.id as id, r1.title as title
+    FROM albums AS r1 JOIN (
+	    SELECT (
+		    RAND() * (
+			    SELECT MAX(id) FROM albums
+		    )
+	    ) AS id
+    )  AS r2
+    WHERE r1.id >= r2.id
+    ORDER BY r1.id ASC
+    LIMIT 1;`)
+
+  return res[0]
+}
+
+const titles = [m.holy12_0(), m.holy12_1(), m.holy12_2(), m.holy12_3(), m.holy12_4(), m.holy12_5()]
+const title = getRandom(titles)
+const albums: { id: number; title: string }[] = await Promise.all(Array.from({ length: 12 }, getRandomAlbum))
+---
+
+<Base>
+  <div class='flex flex-col px-28'>
+    <h1 class='w-full uppercase font-medium tracking-wide text-4xl drop-shadow-2xl mt-5 mb-2 text-center'>{title}</h1>
+    <div class='grid grid-cols-2 md:grid-cols-4 gap-x-1.5 mb-4'>
+      {
+        albums.map((album) => (
+          <AlbumBox title={album.title} href={`/album/${album.id}`} image={`/album/${album.id}.png`} />
+        ))
+      }
+    </div>
+  </div>
+</Base>