diff --git a/packages/frontend/core/src/modules/peek-view/view/modal-container.css.ts b/packages/frontend/core/src/modules/peek-view/view/modal-container.css.ts
index e9ad11b877..bb98db96b8 100644
--- a/packages/frontend/core/src/modules/peek-view/view/modal-container.css.ts
+++ b/packages/frontend/core/src/modules/peek-view/view/modal-container.css.ts
@@ -1,11 +1,12 @@
 import { cssVar } from '@toeverything/theme';
+import { cssVarV2 } from '@toeverything/theme/v2';
 import { style } from '@vanilla-extract/css';
 
 export const modalOverlay = style({
   position: 'fixed',
   inset: 0,
   zIndex: cssVar('zIndexModal'),
-  backgroundColor: cssVar('black30'),
+  backgroundColor: cssVarV2('layer/background/modal'),
   pointerEvents: 'auto',
   selectors: {
     '&[data-anime-state="animating"]': {