diff --git a/src/frontend/src/components/ui/dot-background.tsx b/src/frontend/src/components/ui/dot-background.tsx
index 08873fbc8..048c12a47 100644
--- a/src/frontend/src/components/ui/dot-background.tsx
+++ b/src/frontend/src/components/ui/dot-background.tsx
@@ -12,7 +12,7 @@ export function DotBackgroundDemo({
   return (
     <div
       className={cn(
-        "relative flex h-full w-full items-center justify-center bg-white dark:bg-black",
+        "relative flex h-full w-full items-center justify-center bg-background",
         className,
       )}
     >
@@ -26,7 +26,7 @@ export function DotBackgroundDemo({
       />
       <div
         className={cn(
-          "absolute inset-0 bg-gradient-to-b from-white/10 via-white/50 to-white dark:from-background/30 dark:via-background/80 dark:to-background",
+          "absolute inset-0 bg-gradient-to-b from-background/0 from-0% via-background/50 via-30% to-background to-50%",
           containerClassName,
         )}
       />