diff --git a/src/components/code-editor.vue b/src/components/code-editor.vue
index 06f3985..2a2ff00 100644
--- a/src/components/code-editor.vue
+++ b/src/components/code-editor.vue
@@ -71,15 +71,33 @@ export default {
 }
 </script>
 
-<style>
+<style scoped>
 .container {
   width: 100%;
   height: 100%;
   flex-shrink: 0;
-}
-.cm-editor {
-  width: 100%;
-  height: 100%;
-  outline: none !important;
+
+  :deep(.cm-editor) {
+    width: 100%;
+    height: 100%;
+    outline: none !important;
+  }
+
+  :deep(.cm-scroller) {
+    &::-webkit-scrollbar {
+      width: 6px;
+    }
+    &::-webkit-scrollbar-thumb {
+      border-radius: 3px;
+    }
+    &:hover {
+      &::-webkit-scrollbar {
+        background: var(--color-plain-2);
+      }
+      &::-webkit-scrollbar-thumb {
+        background: var(--color-blue-1);
+      }
+    }
+  }
 }
 </style>
diff --git a/src/pages/playground/main.js b/src/pages/playground/main.js
index 4d5b942..ac03037 100644
--- a/src/pages/playground/main.js
+++ b/src/pages/playground/main.js
@@ -6,6 +6,7 @@
 
 import { createApp } from 'vue'
 import '//jscdn.ink/@bd/ui/latest/tabs/index.js'
+// import '//127.0.0.1:8090/dist/tabs/index.js'
 
 import App from './app.vue'
 
diff --git a/src/pages/playground/views/preview.vue b/src/pages/playground/views/preview.vue
index 6b63a24..5ffb6c5 100644
--- a/src/pages/playground/views/preview.vue
+++ b/src/pages/playground/views/preview.vue
@@ -17,6 +17,7 @@ const template = `<!doctype html>
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
   <link rel="stylesheet" href="//jscdn.ink/@bd/ui/latest/css/reset-basic.css">
+  <style>body {line-height:1.5;font-size:14px;word-wrap: break-word;}</style>
   <style name="css"></style>
   <script async src="//jscdn.ink/es-module-shims/1.6.3/es-module-shims.wasm.js"><\/script>
   <script type="importmap">${JSON.stringify({
@@ -117,6 +118,7 @@ export default {
   position: relative;
   flex-shrink: 0;
   width: 50%;
+  padding: 8px;
   border-left: 1px solid var(--color-plain-2);
 }
 .web {
@@ -124,6 +126,7 @@ export default {
   height: 100%;
   border: 0;
 }
+
 .loading {
   position: absolute;
   top: 0;
@@ -137,19 +140,6 @@ export default {
     height: 1px;
     background: var(--color-blue-1);
     box-shadow: 0 0 5px var(--color-blue-1);
-
-    &.loading {
-      animation: loading 3s linear;
-    }
-  }
-}
-
-@keyframes loading {
-  from {
-    width: 0%;
-  }
-  to {
-    width: 100%;
   }
 }
 </style>
