diff --git a/src/routes/register/+layout.svelte b/src/routes/register/+layout.svelte
index e6e435a..76fc672 100644
--- a/src/routes/register/+layout.svelte
+++ b/src/routes/register/+layout.svelte
@@ -1,3 +1,13 @@
+<script>
+	import { PUBLIC_BASE_PATH } from '$env/static/public';
+</script>
+
+<img
+	class="fixed top-0 left-0 h-full w-full object-cover pointer-events-none blur-[2px]"
+	src="{PUBLIC_BASE_PATH}/img/register-background.webp"
+	alt=""
+/>
+<div class="fixed top-0 left-0 h-full w-full bg-[radial-gradient(rgba(0,0,0,0),rgba(0,0,0,.4))]" />
 <div class="flex justify-center w-full">
 	<slot />
 </div>
diff --git a/src/routes/register/+page.svelte b/src/routes/register/+page.svelte
index b31e789..8717ea3 100644
--- a/src/routes/register/+page.svelte
+++ b/src/routes/register/+page.svelte
@@ -12,7 +12,7 @@
 
 <!--the tooltip when not all fields are correctly filled won't completely show if the overflow is hidden-->
 <div
-	class="absolute top-12 grid card w-11/12 xl:w-2/3 2xl:w-1/2 p-6 shadow-lg"
+	class="grid card w-11/12 xl:w-2/3 2xl:w-1/2 p-6 my-12 bg-base-100 shadow-lg"
 	class:overflow-hidden={registered}
 >
 	{#if !registered}
diff --git a/static/img/register-background.webp b/static/img/register-background.webp
new file mode 100644
index 0000000..3204778
Binary files /dev/null and b/static/img/register-background.webp differ