diff --git a/.changeset/young-pigs-beg.md b/.changeset/young-pigs-beg.md
new file mode 100644
index 0000000000..bfdf726911
--- /dev/null
+++ b/.changeset/young-pigs-beg.md
@@ -0,0 +1,5 @@
+---
+'@backstage/core-components': patch
+---
+
+Add custom styles to scroll bar of the sidebar wrapper to fix flaky behaviour
diff --git a/packages/core-components/src/layout/Sidebar/Items.tsx b/packages/core-components/src/layout/Sidebar/Items.tsx
index dbaa50b76e..e53cdfaa57 100644
--- a/packages/core-components/src/layout/Sidebar/Items.tsx
+++ b/packages/core-components/src/layout/Sidebar/Items.tsx
@@ -291,10 +291,21 @@ export const SidebarDivider = styled('hr')({
   margin: '12px 0px',
 });
 
-export const SidebarScrollWrapper = styled('div')({
+export const SidebarScrollWrapper = styled('div')(({ theme }) => ({
   flex: '0 1 auto',
-  overflowY: 'auto',
+  overflowX: 'hidden',
+  // 5px space to the right of the scrollbar
+  width: 'calc(100% - 5px)',
   // Display at least one item in the container
   // Question: Can this be a config/theme variable - if so, which? :/
   minHeight: '48px',
-});
+  '&::-webkit-scrollbar': {
+    backgroundColor: theme.palette.background.default,
+    width: '5px',
+    borderRadius: '5px',
+  },
+  '&::-webkit-scrollbar-thumb': {
+    backgroundColor: theme.palette.text.hint,
+    borderRadius: '5px',
+  },
+}));