diff --git a/frontend/desktop/src/components/desktop_content/index.tsx b/frontend/desktop/src/components/desktop_content/index.tsx
index 4da3b39b4d1..34c7eb98261 100644
--- a/frontend/desktop/src/components/desktop_content/index.tsx
+++ b/frontend/desktop/src/components/desktop_content/index.tsx
@@ -69,13 +69,7 @@ export default function DesktopContent(props: any) {
   }, [openDesktopApp]);
 
   return (
-    <Box
-      id="desktop"
-      className={styles.desktop}
-      backgroundImage={'url(/images/background.svg)'}
-      backgroundRepeat={'no-repeat'}
-      backgroundSize={'cover'}
-    >
+    <Box id="desktop" className={styles.desktop}>
       <Flex w="100%" h="100%" alignItems={'center'} flexDirection={'column'}>
         <Box mt="12vh" minW={'508px'}>
           <TimeComponent />
diff --git a/frontend/desktop/src/components/layout/index.module.scss b/frontend/desktop/src/components/layout/index.module.scss
deleted file mode 100644
index 9a360da1929..00000000000
--- a/frontend/desktop/src/components/layout/index.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-.desktopContainer {
-  position: relative;
-  width: 100vw;
-  height: 100vh;
-  overflow: hidden;
-}
diff --git a/frontend/desktop/src/components/layout/index.tsx b/frontend/desktop/src/components/layout/index.tsx
index 932ba067b82..88f90b38e5e 100644
--- a/frontend/desktop/src/components/layout/index.tsx
+++ b/frontend/desktop/src/components/layout/index.tsx
@@ -1,5 +1,5 @@
+import { Box } from '@chakra-ui/react';
 import Head from 'next/head';
-import styles from './index.module.scss';
 
 export default function Layout(props: any) {
   return (
@@ -8,7 +8,17 @@ export default function Layout(props: any) {
         <title>sealos Cloud</title>
         <meta name="description" content="sealos cloud dashboard" />
       </Head>
-      <div className={styles.desktopContainer}>{props.children}</div>
+      <Box
+        position={'relative'}
+        width={'100vw'}
+        height={'100vh'}
+        overflow={'hidden'}
+        backgroundImage={'url(/images/background.svg)'}
+        backgroundRepeat={'no-repeat'}
+        backgroundSize={'cover'}
+      >
+        {props.children}
+      </Box>
     </>
   );
 }