diff --git a/src/styles/index.css b/src/styles/index.css
index a4046f8e..46135523 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -24,12 +24,19 @@ html {
   color: theme('colors.black');
 }
 
+html.dark {
+  color: theme('colors.white');
+  background-color: theme('colors.gray.900');
+}
+
 input[type='number']::-webkit-inner-spin-button {
   appearance: none;
 }
+
 input[type='date']::-webkit-calendar-picker-indicator {
   background-color: theme('colors.gray.900');
 }
+
 .window-drag {
   -webkit-app-region: drag;
 }
@@ -173,26 +180,32 @@ input[type='date']::-webkit-calendar-picker-indicator {
   background: transparent;
 }
 
+.dark.custom-scroll::-webkit-scrollbar-track:vertical,
 .dark .custom-scroll::-webkit-scrollbar-track:vertical {
   border-left-color: theme('colors.gray.800');
 }
 
+.dark.custom-scroll::-webkit-scrollbar-track:horizontal,
 .dark .custom-scroll::-webkit-scrollbar-track:horizontal {
   border-top-color: theme('colors.gray.800');
 }
 
+.dark.custom-scroll-thumb1::-webkit-scrollbar-thumb,
 .dark .custom-scroll-thumb1::-webkit-scrollbar-thumb {
   background: theme('colors.gray.850');
 }
 
+.dark.custom-scroll-thumb1::-webkit-scrollbar-thumb:hover,
 .dark .custom-scroll-thumb1::-webkit-scrollbar-thumb:hover {
   background: theme('colors.gray.800');
 }
 
+.dark.custom-scroll-thumb2::-webkit-scrollbar-thumb,
 .dark .custom-scroll-thumb2::-webkit-scrollbar-thumb {
   background: theme('colors.gray.800');
 }
 
+.dark.custom-scroll-thumb2::-webkit-scrollbar-thumb:hover,
 .dark .custom-scroll-thumb2::-webkit-scrollbar-thumb:hover {
   background: theme('colors.gray.875');
 }
@@ -232,6 +245,7 @@ input[type='date']::-webkit-calendar-picker-indicator {
   border-right: solid 1px theme('colors.gray.200');
 }
 
+[dir='rtl'].dark.custom-scroll::-webkit-scrollbar-track:vertical,
 [dir='rtl'].dark .custom-scroll::-webkit-scrollbar-track:vertical {
   border-right: solid 1px theme('colors.gray.850');
 }
diff --git a/src/utils/theme.ts b/src/utils/theme.ts
index 06607500..dbcdfb4c 100644
--- a/src/utils/theme.ts
+++ b/src/utils/theme.ts
@@ -1,6 +1,10 @@
 export function setDarkMode(darkMode: boolean): void {
   if (darkMode) {
-    document.documentElement.classList.add('dark');
+    document.documentElement.classList.add(
+      'dark',
+      'custom-scroll',
+      'custom-scroll-thumb1'
+    );
     return;
   }
   document.documentElement.classList.remove('dark');