diff --git a/components/drawer/__tests__/__snapshots__/demo-extend.test.tsx.snap b/components/drawer/__tests__/__snapshots__/demo-extend.test.tsx.snap
index 087e968daa..41a4deae36 100644
--- a/components/drawer/__tests__/__snapshots__/demo-extend.test.tsx.snap
+++ b/components/drawer/__tests__/__snapshots__/demo-extend.test.tsx.snap
@@ -2902,7 +2902,7 @@ Array [
 
 exports[`renders ./components/drawer/demo/render-in-current.tsx extend context correctly 1`] = `
 <div
-  class="site-drawer-render-in-current-wrapper"
+  style="position:relative;height:200px;padding:48px;overflow:hidden;text-align:center;background:rgba(0, 0, 0, 0.02);border:1px solid #f0f0f0;border-radius:8px"
 >
   Render in this
   <div
diff --git a/components/drawer/__tests__/__snapshots__/demo.test.ts.snap b/components/drawer/__tests__/__snapshots__/demo.test.ts.snap
index 440944f844..ba9cb96f3d 100644
--- a/components/drawer/__tests__/__snapshots__/demo.test.ts.snap
+++ b/components/drawer/__tests__/__snapshots__/demo.test.ts.snap
@@ -296,7 +296,7 @@ exports[`renders ./components/drawer/demo/placement.tsx correctly 1`] = `
 
 exports[`renders ./components/drawer/demo/render-in-current.tsx correctly 1`] = `
 <div
-  class="site-drawer-render-in-current-wrapper"
+  style="position:relative;height:200px;padding:48px;overflow:hidden;text-align:center;background:rgba(0, 0, 0, 0.02);border:1px solid #f0f0f0;border-radius:8px"
 >
   Render in this
   <div
diff --git a/components/drawer/demo/render-in-current.md b/components/drawer/demo/render-in-current.md
index 23273e79c8..3432c20348 100644
--- a/components/drawer/demo/render-in-current.md
+++ b/components/drawer/demo/render-in-current.md
@@ -9,23 +9,3 @@
 Render in current dom. custom container, check `getContainer`.
 
 > Note: `style` and `className` props are moved to Drawer panel in v5 which is aligned with Modal component. Original `style` and `className` props are replaced by `rootStyle` and `rootClassName`.
-
-```css
-.site-drawer-render-in-current-wrapper {
-  position: relative;
-  height: 200px;
-  padding: 48px;
-  overflow: hidden;
-  text-align: center;
-  background: #fafafa;
-  border: 1px solid #ebedf0;
-  border-radius: 2px;
-}
-```
-
-<style>
-[data-theme="dark"] .site-drawer-render-in-current-wrapper {
-  background: #000;
-  border: 1px solid #303030;
-}
-</style>
diff --git a/components/drawer/demo/render-in-current.tsx b/components/drawer/demo/render-in-current.tsx
index 024918a2aa..3e4cfb426d 100644
--- a/components/drawer/demo/render-in-current.tsx
+++ b/components/drawer/demo/render-in-current.tsx
@@ -1,7 +1,8 @@
 import React, { useState } from 'react';
-import { Button, Drawer } from 'antd';
+import { Button, Drawer, theme } from 'antd';
 
 const App: React.FC = () => {
+  const { token } = theme.useToken();
   const [open, setOpen] = useState(false);
 
   const showDrawer = () => {
@@ -12,8 +13,19 @@ const App: React.FC = () => {
     setOpen(false);
   };
 
+  const containerStyle: React.CSSProperties = {
+    position: 'relative',
+    height: 200,
+    padding: 48,
+    overflow: 'hidden',
+    textAlign: 'center',
+    background: token.colorFillAlter,
+    border: `1px solid ${token.colorBorderSecondary}`,
+    borderRadius: token.borderRadiusLG,
+  };
+
   return (
-    <div className="site-drawer-render-in-current-wrapper">
+    <div style={containerStyle}>
       Render in this
       <div style={{ marginTop: 16 }}>
         <Button type="primary" onClick={showDrawer}>