diff --git a/nuxt/package.json b/nuxt/package.json
index 2e929d0..6729698 100644
--- a/nuxt/package.json
+++ b/nuxt/package.json
@@ -25,6 +25,7 @@
     "image-size": "^1.0.2",
     "kaokun": "^1.1.10",
     "lightningcss": "^1.22.1",
+    "magic-snowflakes": "^6.3.0",
     "nanoid": "^5.0.4",
     "normalize.css": "^8.0.1",
     "nuxt": "^3.9.0",
diff --git a/nuxt/pnpm-lock.yaml b/nuxt/pnpm-lock.yaml
index f06bda1..f28af2a 100644
--- a/nuxt/pnpm-lock.yaml
+++ b/nuxt/pnpm-lock.yaml
@@ -47,6 +47,9 @@ dependencies:
   lightningcss:
     specifier: ^1.22.1
     version: 1.22.1
+  magic-snowflakes:
+    specifier: ^6.3.0
+    version: 6.3.0
   nanoid:
     specifier: ^5.0.4
     version: 5.0.4
@@ -2560,6 +2563,7 @@ packages:
     dependencies:
       is-glob: 4.0.3
       micromatch: 4.0.5
+      napi-wasm: 1.1.0
     dev: false
     bundledDependencies:
       - napi-wasm
@@ -7460,6 +7464,11 @@ packages:
       unplugin: 1.5.1
     dev: false
 
+  /magic-snowflakes@6.3.0:
+    resolution: {integrity: sha512-sTENq0CmS7r70BA5XyRuA9a0dYbF6ENyTzAHUDd5yjPacUTXNAd/NyTF6E3iEt2SuX/aonyW7dtTm3ILN74AXQ==}
+    engines: {node: '>=10'}
+    dev: false
+
   /magic-string-ast@0.3.0:
     resolution: {integrity: sha512-0shqecEPgdFpnI3AP90epXyxZy9g6CRZ+SZ7BcqFwYmtFEnZ1jpevcV5HoyVnlDS9gCnc1UIg3Rsvp3Ci7r8OA==}
     engines: {node: '>=16.14.0'}
@@ -8405,6 +8414,10 @@ packages:
     dev: false
     optional: true
 
+  /napi-wasm@1.1.0:
+    resolution: {integrity: sha512-lHwIAJbmLSjF9VDRm9GoVOy9AGp3aIvkjv+Kvz9h16QR3uSVYH78PNQUnT2U4X53mhlnV2M7wrhibQ3GHicDmg==}
+    dev: false
+
   /natural-compare@1.4.0:
     resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
 
diff --git a/nuxt/src/layouts/default.vue b/nuxt/src/layouts/default.vue
index 5a88e05..37e2bd9 100644
--- a/nuxt/src/layouts/default.vue
+++ b/nuxt/src/layouts/default.vue
@@ -1,4 +1,5 @@
 <template>
+  <div class="snowflakes-container" />
   <div class="layout">
     <TheHeader />
     <main>
@@ -8,6 +9,20 @@
   </div>
 </template>
 
+<script setup lang="ts">
+import Snowflakes from 'magic-snowflakes'
+
+onMounted(() => {
+  // eslint-disable-next-line no-new
+  new Snowflakes({
+    container: document.querySelector<HTMLDivElement>('.snowflakes-container') as HTMLDivElement,
+    color: '#808080',
+    minOpacity: 0.2,
+    minSize: 1,
+  })
+})
+</script>
+
 <style lang="sass" scoped>
 :global(html)
   display: flex
@@ -33,4 +48,11 @@ main
   align-items: center
   flex-grow: 1
   padding: var(--f-32-16) var(--f-64-16)
+
+.snowflakes-container
+  position: fixed
+  height: 100vh
+  width: 100vw
+  pointer-events: none
+  user-select: none
 </style>