diff --git a/assets/scss/partials/highlight/dark.scss b/assets/scss/partials/highlight/dark.scss
index 2c13946..0c38bb5 100644
--- a/assets/scss/partials/highlight/dark.scss
+++ b/assets/scss/partials/highlight/dark.scss
@@ -6,7 +6,26 @@
 /* Background */
 .chroma {
     color: #f8f8f2;
-    background-color: #272822
+    background-color: #272822;
+
+    /* scrollbar styles for Firefox */
+    scrollbar-width: auto;
+    scrollbar-color: var(--scrollbar-thumb) #272822;
+    /**/
+
+    /* scrollbar styles for Chromium */
+    &::-webkit-scrollbar {
+        height: auto;
+    }
+
+    &::-webkit-scrollbar-thumb {
+        background-color: var(--scrollbar-thumb);
+    }
+
+    &::-webkit-scrollbar-track {
+        background-color: #272822;
+    }
+    /**/
 }
 
 /* Other */
@@ -381,4 +400,4 @@
 .chroma .gl {}
 
 /* TextWhitespace */
-.chroma .w {}
\ No newline at end of file
+.chroma .w {}
diff --git a/assets/scss/partials/highlight/light.scss b/assets/scss/partials/highlight/light.scss
index 9ddcff9..b4d1ea6 100644
--- a/assets/scss/partials/highlight/light.scss
+++ b/assets/scss/partials/highlight/light.scss
@@ -7,6 +7,25 @@
 .chroma {
     color: #272822;
     background-color: #fafafa;
+
+    /* scrollbar styles for Firefox */
+    scrollbar-width: auto;
+    scrollbar-color: var(--scrollbar-thumb) #fafafa;
+    /**/
+
+    /* scrollbar styles for Chromium */
+    &::-webkit-scrollbar {
+        height: auto;
+    }
+
+    &::-webkit-scrollbar-thumb {
+        background-color: var(--scrollbar-thumb);
+    }
+
+    &::-webkit-scrollbar-track {
+        background-color: #fafafa;
+    }
+    /**/
 }
 
 /* Other */
@@ -403,4 +422,4 @@
 .chroma .gl {}
 
 /* TextWhitespace */
-.chroma .w {}
\ No newline at end of file
+.chroma .w {}