diff --git a/src/AuroraBackground/demos/index.tsx b/src/AuroraBackground/demos/index.tsx
new file mode 100644
index 00000000..976c50f2
--- /dev/null
+++ b/src/AuroraBackground/demos/index.tsx
@@ -0,0 +1,3 @@
+import { AuroraBackground } from '@lobehub/ui';
+
+export default () => <AuroraBackground />;
diff --git a/src/AuroraBackground/index.md b/src/AuroraBackground/index.md
new file mode 100644
index 00000000..afa8f8e3
--- /dev/null
+++ b/src/AuroraBackground/index.md
@@ -0,0 +1,13 @@
+---
+nav: Components
+group: Site
+title: AuroraBackground
+---
+
+## Default
+
+<code src="./demos/index.tsx" nopadding></code>
+
+## APIs
+
+<API></API>
diff --git a/src/AuroraBackground/index.tsx b/src/AuroraBackground/index.tsx
index c24af21d..780291b4 100644
--- a/src/AuroraBackground/index.tsx
+++ b/src/AuroraBackground/index.tsx
@@ -76,6 +76,8 @@ const useStyles = createStyles(({ isDarkMode, css }) => {
 
       will-change: transform;
 
+      max-height: 100vh;
+
       &::after {
         ${background};
         position: absolute;