diff --git a/stylesheets/_index.scss b/stylesheets/_index.scss
index e3b16fac6c6..fa0aaecf6b9 100644
--- a/stylesheets/_index.scss
+++ b/stylesheets/_index.scss
@@ -29,9 +29,6 @@
   @include light-theme {
     background-color: $color-gray-02;
 
-    ::-webkit-scrollbar-track {
-      background: $color-gray-02;
-    }
     ::-webkit-scrollbar-thumb {
       border: 2px solid $color-gray-02;
     }
@@ -39,9 +36,6 @@
   @include dark-theme {
     background-color: $color-gray-80;
 
-    ::-webkit-scrollbar-track {
-      background: $color-gray-80;
-    }
     ::-webkit-scrollbar-thumb {
       border: 2px solid $color-gray-80;
     }
diff --git a/stylesheets/_mixins.scss b/stylesheets/_mixins.scss
index e21e4a8e683..53fb8602042 100644
--- a/stylesheets/_mixins.scss
+++ b/stylesheets/_mixins.scss
@@ -572,3 +572,30 @@
     }
   }
 }
+
+@mixin scrollbar {
+  &::-webkit-scrollbar-thumb {
+    border-radius: 4px;
+    visibility: hidden;
+    width: 6px;
+
+    @include light-theme {
+      background: $color-black-alpha-40;
+    }
+    @include dark-theme {
+      background: $color-white-alpha-40;
+    }
+  }
+
+  &::-webkit-scrollbar {
+    background: transparent;
+  }
+
+  &::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  &:hover::-webkit-scrollbar-thumb {
+    visibility: visible;
+  }
+}
diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss
index 2b45f94d486..aa89f34587b 100644
--- a/stylesheets/_modules.scss
+++ b/stylesheets/_modules.scss
@@ -5622,22 +5622,7 @@ button.module-image__border-overlay:focus {
 // Module: conversation list
 
 .module-conversation-list {
-  &::-webkit-scrollbar-thumb {
-    border-radius: 4px;
-    visibility: hidden;
-    width: 6px;
-
-    @include light-theme {
-      background: $color-black-alpha-40;
-    }
-    @include dark-theme {
-      background: $color-white-alpha-40;
-    }
-  }
-
-  &:hover::-webkit-scrollbar-thumb {
-    visibility: visible;
-  }
+  @include scrollbar;
 
   &--scroll-behavior {
     &-default {
@@ -6373,6 +6358,10 @@ button.module-image__border-overlay:focus {
 .module-timeline {
   height: 100%;
   overflow: hidden;
+
+  .ReactVirtualized__List {
+    @include scrollbar;
+  }
 }
 
 .module-timeline--disabled {
diff --git a/ts/components/conversation/Timeline.tsx b/ts/components/conversation/Timeline.tsx
index 28e93e3faf1..0c2d321dc38 100644
--- a/ts/components/conversation/Timeline.tsx
+++ b/ts/components/conversation/Timeline.tsx
@@ -1369,6 +1369,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
               scrollToIndex={scrollToIndex}
               tabIndex={-1}
               width={width}
+              style={{ overflow: 'overlay' }}
             />
           );
         }}