diff --git a/src/lib/components/scroll-top-button.svelte b/src/lib/components/scroll-top-button.svelte
new file mode 100644
index 0000000..1a6a27f
--- /dev/null
+++ b/src/lib/components/scroll-top-button.svelte
@@ -0,0 +1,34 @@
+<script lang="ts">
+    let y: number;
+
+    function scrollToTop() {
+        document.documentElement.scrollTop = 0;
+    }
+</script>
+
+<svelte:window bind:scrollY={y} />
+
+{#if y > 2400}
+    <button class="scroll-top-button" onclick={scrollToTop}>↑</button>
+{/if}
+
+<style>
+    .scroll-top-button {
+        position: fixed;
+        bottom: 24px;
+        right: 48px;
+        font-size: 1.4rem;
+        cursor: pointer;
+        border: var(--border-style) var(--border-dash-size) var(--color-highlight);
+        color: var(--color-highlight);
+        background-color: var(--color-background-highlight);
+        backdrop-filter: blur(var(--blur-radius-background));
+        padding: 12px;
+        transition: background-color var(--duration-animation) ease-out;
+        z-index: 10;
+    }
+
+    .scroll-top-button:hover {
+        background-color: var(--color-background-highlight-hover);
+    }
+</style>
\ No newline at end of file
diff --git a/src/lib/viewport/content.svelte b/src/lib/viewport/content.svelte
index deb29f7..3276ba6 100644
--- a/src/lib/viewport/content.svelte
+++ b/src/lib/viewport/content.svelte
@@ -1,8 +1,11 @@
 <script lang="ts">
+    import ScrollTopButton from "$lib/components/scroll-top-button.svelte";
+
     let { children } = $props();
 </script>
 
 <div class="main-content">
+    <ScrollTopButton />
     {@render children()}
 </div>