diff --git a/src/components/Dialog/index.tsx b/src/components/Dialog/index.tsx
index 268d804331..95f6437e77 100644
--- a/src/components/Dialog/index.tsx
+++ b/src/components/Dialog/index.tsx
@@ -62,9 +62,10 @@ export function Outer({
         {...sheetOptions}
         ref={sheet}
         index={-1}
-        backgroundStyle={{backgroundColor: t.atoms.bg.backgroundColor}}
+        backgroundStyle={{backgroundColor: 'transparent'}}
         backdropComponent={props => (
           <BottomSheetBackdrop
+            opacity={0.4}
             appearsOnIndex={0}
             disappearsOnIndex={-1}
             {...props}
diff --git a/src/components/Dialog/index.web.tsx b/src/components/Dialog/index.web.tsx
index d1d25a9019..514013d673 100644
--- a/src/components/Dialog/index.web.tsx
+++ b/src/components/Dialog/index.web.tsx
@@ -90,8 +90,7 @@ export function Outer({
                     style={[
                       web(a.fixed),
                       a.inset_0,
-                      t.atoms.bg,
-                      {opacity: 0.8},
+                      {opacity: 0.5, backgroundColor: t.palette.black},
                     ]}
                   />
                 )}