diff --git a/packages/vkui/src/components/Panel/Panel.tsx b/packages/vkui/src/components/Panel/Panel.tsx
index dd64b60289..894d6d1091 100644
--- a/packages/vkui/src/components/Panel/Panel.tsx
+++ b/packages/vkui/src/components/Panel/Panel.tsx
@@ -1,10 +1,8 @@
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
-import { usePlatform } from '../../hooks/usePlatform';
 import { SizeType } from '../../lib/adaptivity';
 import { NavIdProps } from '../../lib/getNavId';
-import { Platform } from '../../lib/platform';
 import { HTMLAttributesWithRootRef } from '../../types';
 import { AppRootContext } from '../AppRoot/AppRootContext';
 import { NavPanelIdContext } from '../NavIdContext/NavIdContext';
@@ -27,7 +25,6 @@ export interface PanelProps extends HTMLAttributesWithRootRef<HTMLDivElement>, N
  * @see https://vkcom.github.io/VKUI/#/Panel
  */
 export const Panel = ({ centered = false, children, nav, ...restProps }: PanelProps) => {
-  const platform = usePlatform();
   const { sizeX = 'none' } = useAdaptivity();
   const { layout } = React.useContext(AppRootContext);
 
@@ -48,7 +45,6 @@ export const Panel = ({ centered = false, children, nav, ...restProps }: PanelPr
         >
           <div className={styles['Panel__in-before']} />
           {centered ? <div className={styles['Panel__centered']}>{children}</div> : children}
-          {platform === Platform.IOS && <div className="vkuiInternalPanel__fade" />}
           <div className={styles['Panel__in-after']} />
         </Touch>
       </RootComponent>
diff --git a/packages/vkui/src/components/View/View.module.css b/packages/vkui/src/components/View/View.module.css
index 6f84ef3f17..7bbd856aee 100644
--- a/packages/vkui/src/components/View/View.module.css
+++ b/packages/vkui/src/components/View/View.module.css
@@ -42,9 +42,55 @@
   overflow: hidden;
 }
 
+.View__panel-overlay {
+  display: none;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  background-color: #000;
+  pointer-events: none;
+  z-index: var(--vkui_internal--z_index_panel_header_fade);
+}
+
+/**
+ * Panel swipe back
+ */
+
+.View--ios .View__panel--swipe-back-prev.View__panel--swipe-back-success {
+  transition: transform 0.3s var(--vkui--animation_easing_platform);
+  transform: translate3d(100%, 0, 0);
+}
+
+.View--ios .View__panel--swipe-back-next.View__panel--swipe-back-success {
+  transition: transform 0.3s var(--vkui--animation_easing_platform);
+  transform: translate3d(0, 0, 0);
+}
+
+.View--ios .View__panel--swipe-back-prev.View__panel--swipe-back-failed {
+  transition: transform 0.3s var(--vkui--animation_easing_platform);
+  transform: translate3d(0, 0, 0);
+}
+
+.View--ios .View__panel--swipe-back-next.View__panel--swipe-back-failed {
+  transition: transform 0.3s var(--vkui--animation_easing_platform);
+  transform: translate3d(-50%, 0, 0);
+}
+
+.View--ios .View__panel--swipe-back-next .View__panel-overlay {
+  background-color: rgba(0, 0, 0, 0.1);
+}
+
+.View--ios .View__panel--swipe-back-next.View__panel--swipe-back-success .View__panel-overlay,
+.View--ios .View__panel--swipe-back-next.View__panel--swipe-back-failed .View__panel-overlay {
+  transition: opacity 0.3s var(--vkui--animation_easing_platform);
+}
+
 /**
  * Panel transition
  */
+
 .View__panel--next ~ .View__panel--prev {
   animation: animation-view-prev-back 0.3s var(--vkui--animation_easing_platform) forwards;
 }
@@ -80,37 +126,6 @@
   }
 }
 
-/**
- * Panel swipe back
- */
-
-.View--ios .View__panel--swipe-back-prev {
-  box-shadow: -2px 0 12px rgba(0, 0, 0, 0.3);
-}
-
-.View--ios .View__panel--swipe-back-prev.View__panel--swipe-back-success {
-  transition: transform 0.3s var(--vkui--animation_easing_platform);
-  transform: translate3d(100%, 0, 0);
-}
-
-.View--ios .View__panel--swipe-back-next.View__panel--swipe-back-success {
-  transition: transform 0.3s var(--vkui--animation_easing_platform);
-  transform: translate3d(0, 0, 0);
-}
-
-.View--ios .View__panel--swipe-back-prev.View__panel--swipe-back-failed {
-  transition: transform 0.3s var(--vkui--animation_easing_platform);
-  transform: translate3d(0, 0, 0);
-}
-
-.View--ios .View__panel--swipe-back-next.View__panel--swipe-back-failed {
-  transition: transform 0.3s var(--vkui--animation_easing_platform);
-  transform: translate3d(-50%, 0, 0);
-}
-
-/**
- * Panel transition
- */
 .View--ios .View__panel--prev {
   animation: animation-ios-prev-forward 0.6s var(--vkui--animation_easing_platform);
 }
@@ -127,28 +142,21 @@
   animation: animation-ios-prev-back 0.6s var(--vkui--animation_easing_platform) forwards;
 }
 
-.View--ios .View__panel--prev :global(.vkuiInternalPanel__fade),
-.View--ios .View__panel--next :global(.vkuiInternalPanel__fade) {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  left: 0;
-  top: 0;
-  background: #000;
-  pointer-events: none;
-  z-index: var(--vkui_internal--z_index_panel_header_fade);
+.View--ios .View__panel--prev .View__panel-overlay,
+.View--ios .View__panel--next .View__panel-overlay {
+  display: block;
 }
 
-.View--ios .View__panel--prev :global(.vkuiInternalPanel__fade) {
+.View--ios .View__panel--prev .View__panel-overlay {
   animation: animation-ios-fade-in 0.6s var(--vkui--animation_easing_platform);
 }
 
-.View--ios .View__panel--next :global(.vkuiInternalPanel__fade) {
+.View--ios .View__panel--next .View__panel-overlay {
   animation: animation-ios-fade-out 0.6s var(--vkui--animation_easing_platform) forwards;
 }
 
-.View--ios .View__panel--prev ~ .View__panel--next :global(.vkuiInternalPanel__fade),
-.View--ios .View__panel--next ~ .View__panel--prev :global(.vkuiInternalPanel__fade) {
+.View--ios .View__panel--prev ~ .View__panel--next .View__panel-overlay,
+.View--ios .View__panel--next ~ .View__panel--prev .View__panel-overlay {
   display: none;
 }
 
@@ -160,7 +168,7 @@
 /**
  * Active panel
  */
-.View--ios .View__panel--active :global(.vkuiInternalPanel__fade) {
+.View--ios .View__panel--active .View__panel-overlay {
   display: none;
 }
 
diff --git a/packages/vkui/src/components/View/View.tsx b/packages/vkui/src/components/View/View.tsx
index a793b51de5..1765e8d158 100644
--- a/packages/vkui/src/components/View/View.tsx
+++ b/packages/vkui/src/components/View/View.tsx
@@ -353,11 +353,6 @@ export const View = ({
 
     let prevPanelTranslate = `${swipeBackShift}px`;
     let nextPanelTranslate = `${-50 + (swipeBackShift * 100) / window.innerWidth / 2}%`;
-    let prevPanelShadow = (0.3 * (window.innerWidth - swipeBackShift)) / window.innerWidth;
-
-    if (swipeBackResult) {
-      return isPrev ? { boxShadow: `-2px 0 12px rgba(0, 0, 0, ${prevPanelShadow})` } : {};
-    }
 
     if (isNext) {
       return {
@@ -369,13 +364,36 @@ export const View = ({
       return {
         transform: `translate3d(${prevPanelTranslate}, 0, 0)`,
         WebkitTransform: `translate3d(${prevPanelTranslate}, 0, 0)`,
-        boxShadow: `-2px 0 12px rgba(0, 0, 0, ${prevPanelShadow})`,
       };
     }
 
     return {};
   };
 
+  const calcPanelSwipeBackOverlayStyles = (panelId?: string): React.CSSProperties => {
+    if (!canUseDOM || !window) {
+      return {};
+    }
+
+    const isNext = panelId === swipeBackNextPanel;
+    if (!isNext) {
+      return {};
+    }
+
+    const calculatedOpacity = 1 - swipeBackShift / window.innerWidth;
+    const opacityOnSwipeEnd =
+      swipeBackResult === SwipeBackResults.success
+        ? 0
+        : swipeBackResult === SwipeBackResults.fail
+        ? 1
+        : null;
+
+    return {
+      display: 'block',
+      opacity: opacityOnSwipeEnd === null ? calculatedOpacity : opacityOnSwipeEnd,
+    };
+  };
+
   React.useEffect(() => {
     // Нужен переход
     if (
@@ -533,6 +551,12 @@ export const View = ({
                 style={calcPanelSwipeStyles(panelId)}
                 key={panelId}
               >
+                {platform === Platform.IOS && (
+                  <div
+                    className={styles['View__panel-overlay']}
+                    style={calcPanelSwipeBackOverlayStyles(panelId)}
+                  />
+                )}
                 <div
                   className={styles['View__panel-in']}
                   style={{