diff --git a/app/javascript/v3/views/auth/start/components/ModalLayout.vue b/app/javascript/v3/views/auth/start/components/ModalLayout.vue
index 48791fda6..53116dbdb 100644
--- a/app/javascript/v3/views/auth/start/components/ModalLayout.vue
+++ b/app/javascript/v3/views/auth/start/components/ModalLayout.vue
@@ -1,7 +1,12 @@
 <template>
   <section
-    class="min-h-screen px-8 py-20 dark:text-white bg-woot-25 dark:bg-slate-900"
+    class="relative h-screen px-8 py-20 dark:text-white bg-woot-25 dark:bg-slate-900"
   >
+    <img
+      id="bg-grad"
+      src="/onboarding/bg-gradient.png"
+      class="absolute inset-0 w-full opacity-50 dark:mix-blend-color"
+    />
     <div class="relative max-w-lg mx-auto">
       <div
         id="steps"
diff --git a/public/onboarding/bg-gradient.png b/public/onboarding/bg-gradient.png
new file mode 100644
index 000000000..07908873b
Binary files /dev/null and b/public/onboarding/bg-gradient.png differ