diff --git a/src/components/Toast/Toaster.web.tsx b/src/components/Toast/Toaster.web.tsx
index dd61b23f85..ae8dc55b87 100644
--- a/src/components/Toast/Toaster.web.tsx
+++ b/src/components/Toast/Toaster.web.tsx
@@ -1,13 +1,15 @@
 import {Toaster as BurntToaster} from 'burnt/web'
 
-import {useBreakpoints, useTheme} from '#/alf'
+import {flatten, useBreakpoints, useTheme} from '#/alf'
 
 export function Toaster() {
   const t = useTheme()
   const {gtMobile} = useBreakpoints()
+
   return (
     <BurntToaster
       theme={t.scheme}
+      toastOptions={{style: flatten([t.atoms.bg])}}
       position={gtMobile ? 'bottom-left' : 'top-center'}
     />
   )