diff --git a/packages/playground/src/main.ts b/packages/playground/src/main.ts
index 2e4c79f1..ae7fa819 100644
--- a/packages/playground/src/main.ts
+++ b/packages/playground/src/main.ts
@@ -3,6 +3,8 @@ import { createApp } from 'vue'
 import type { RouteRecordRaw } from 'vue-router'
 import { createRouter, createWebHistory } from 'vue-router'
 
+import { addCustomTab } from '@vue/devtools-next-api'
+
 // import { devtools } from '@vue/devtools-next'
 import App2 from './App.vue'
 import App from './App.preview.vue'
@@ -50,6 +52,18 @@ const router2 = createRouter({
   routes,
 })
 
+addCustomTab({
+  name: 'vueuse',
+  // @unocss-include
+  icon: 'i-logos-vueuse',
+  title: 'VueUse',
+  view: {
+    type: 'iframe',
+    src: 'https://vueuse.org/',
+  },
+  category: 'app',
+})
+
 app.use(router)
 app.use(pinia)