diff --git a/.changeset/warm-squids-deliver.md b/.changeset/warm-squids-deliver.md
new file mode 100644
index 000000000000..0ec0a9407993
--- /dev/null
+++ b/.changeset/warm-squids-deliver.md
@@ -0,0 +1,5 @@
+---
+'@rocket.chat/meteor': minor
+---
+
+Changes the scrollbar color in order to improve the contrast and accessibility compliance
diff --git a/apps/meteor/client/components/CustomScrollbars/CustomScrollbars.tsx b/apps/meteor/client/components/CustomScrollbars/CustomScrollbars.tsx
index c98dcb0d7e65..18bdbdead14e 100644
--- a/apps/meteor/client/components/CustomScrollbars/CustomScrollbars.tsx
+++ b/apps/meteor/client/components/CustomScrollbars/CustomScrollbars.tsx
@@ -1,3 +1,4 @@
+import { Palette } from '@rocket.chat/fuselage';
 import type { ScrollValues } from 'rc-scrollbars';
 import { Scrollbars } from 'rc-scrollbars';
 import type { MutableRefObject, CSSProperties, ReactNode, ReactElement } from 'react';
@@ -43,7 +44,7 @@ const CustomScrollbars = forwardRef<HTMLElement, CustomScrollbarsProps>(function
 				overflowX ? undefined : (props): ReactElement => <div {...props} className='track-horizontal' style={{ display: 'none' }} />
 			}
 			renderThumbVertical={({ style, ...props }): JSX.Element => (
-				<div {...props} style={{ ...style, backgroundColor: 'rgba(0, 0, 0, 0.5)', borderRadius: '7px' }} />
+				<div {...props} style={{ ...style, backgroundColor: Palette.stroke['stroke-dark'].toString(), borderRadius: '4px' }} />
 			)}
 			children={children}
 			ref={refSetter}