diff --git a/docs/.vitepress/vitepress/composables/use-playground.ts b/docs/.vitepress/vitepress/composables/use-playground.ts
index ec5c4122e1..fa1223fc10 100644
--- a/docs/.vitepress/vitepress/composables/use-playground.ts
+++ b/docs/.vitepress/vitepress/composables/use-playground.ts
@@ -1,4 +1,5 @@
 import { utoa } from '../utils'
+import { isDark } from './dark'
 
 const MAIN_FILE_NAME = 'App.vue'
 
@@ -10,11 +11,19 @@ export const usePlayground = (source: string) => {
 
   const encoded = utoa(JSON.stringify(originCode))
   const isPreview = location.host.startsWith('preview')
-  let link = `https://element-plus.run/#${encoded}`
+  let link = `https://element-plus.run/`
   if (isPreview) {
     const pr = location.host.split('-', 2)[1]
-    link = `https://element-plus.run/?pr=${pr}#${encoded}`
+    link = `${link}?pr=${pr}`
   }
+  if (isDark.value) {
+    if (isPreview) {
+      link += '&theme=dark'
+    } else {
+      link = `${link}?theme=dark`
+    }
+  }
+  link += `#${encoded}`
   return {
     encoded,
     link,