diff --git a/assets/scss/partials/layout/list.scss b/assets/scss/partials/layout/list.scss
index 1a0e346..bcb276c 100644
--- a/assets/scss/partials/layout/list.scss
+++ b/assets/scss/partials/layout/list.scss
@@ -52,6 +52,24 @@
     margin-bottom: var(--section-separation);
     overflow-x: auto;
 
+    /* scrollbar styles for Firefox */
+    scrollbar-width: auto;
+    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
+
+    /* scrollbar styles for Chromium */
+    &::-webkit-scrollbar {
+        height: auto;
+    }
+
+    &::-webkit-scrollbar-thumb {
+        background-color: var(--scrollbar-thumb);
+    }
+
+    &::-webkit-scrollbar-track {
+        background-color: var(--scrollbar-track);
+    }
+    /**/
+
     .article-list--tile {
         display: flex;
         padding-bottom: 15px;
diff --git a/assets/scss/variables.scss b/assets/scss/variables.scss
index cba32e5..f261f41 100644
--- a/assets/scss/variables.scss
+++ b/assets/scss/variables.scss
@@ -36,12 +36,17 @@ $defaultTagColors: #fff, #fff, #fff, #fff, #fff;
 
     --section-separation: 40px;
 
+    --scrollbar-thumb: hsl(0, 0%, 85%);
+    --scrollbar-track: var(--body-background);
+
     [data-scheme="dark"] {
         --body-background: #303030;
         --accent-color: #ecf0f1;
         --accent-color-darker: #bdc3c7;
         --accent-color-text: #000;
         --body-text-color: rgba(255, 255, 255, 0.7);
+        --scrollbar-thumb: #424242;
+        --scrollbar-track: var(--body-background);
     }
 }