diff --git a/src/assets/less/theme.less b/src/assets/less/theme.less
index 2fb4adb8d..a34bcac00 100644
--- a/src/assets/less/theme.less
+++ b/src/assets/less/theme.less
@@ -8,6 +8,9 @@
 
 .dark {
   .container {
+    .CodeMirror-wrap {
+      background-color: @nightCodeMirrorColor;
+    }
     .output_night {
       .preview {
         background-color: @nightPreviewColor;
diff --git a/src/components/CodemirrorEditor/RightSlider.vue b/src/components/CodemirrorEditor/RightSlider.vue
index a8d4853d8..87f344485 100644
--- a/src/components/CodemirrorEditor/RightSlider.vue
+++ b/src/components/CodemirrorEditor/RightSlider.vue
@@ -40,11 +40,12 @@ const formatOptions = ref<Format[]>([`rgb`, `hex`, `hsl`, `hsv`])
 
 <template>
   <div
-    class="overflow-hidden border-l-2 border-gray/20 bg-gray/20 transition-width duration-300 dark:bg-[#191c20]"
+    class="overflow-hidden border-l-2 border-gray/20 bg-white transition-width duration-300 dark:bg-[#191c20]"
     :class="{
       'w-0 border-l-0': !store.isOpenRightSlider,
       'w-100': store.isOpenRightSlider,
     }"
+    style="z-index: 999;"
   >
     <div
       class="space-y-4 h-full overflow-auto p-4 transition-transform" :class="{