diff --git a/website/src/css/custom.css b/website/src/css/custom.css
index a03c569da..cc8647097 100644
--- a/website/src/css/custom.css
+++ b/website/src/css/custom.css
@@ -1,3 +1,4 @@
+@import "./scrollbar.css";
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
@@ -5366,21 +5367,21 @@ nav.table-of-contents .table-of-contents__link--active,
 }
 
 .tableOfContents::-webkit-scrollbar-thumb {
-  background-color: rgba(107, 114, 128, 0.3);
+  background-color: rgba(16, 185, 129, 0.3);
   border-radius: 10px;
 }
 
 .tableOfContents::-webkit-scrollbar-thumb:hover {
-  background-color: rgba(107, 114, 128, 0.5);
+  background-color: rgba(16, 185, 129, 0.5);
 }
 
 /* Dark mode scrollbar */
 [data-theme="dark"] .tableOfContents::-webkit-scrollbar-thumb {
-  background-color: rgba(156, 163, 175, 0.3);
+  background-color: rgba(16, 185, 129, 0.25);
 }
 
 [data-theme="dark"] .tableOfContents::-webkit-scrollbar-thumb:hover {
-  background-color: rgba(156, 163, 175, 0.5);
+  background-color: rgba(16, 185, 129, 0.45);
 }
 
 /* Animate the active TOC item */
diff --git a/website/src/css/scrollbar.css b/website/src/css/scrollbar.css
new file mode 100644
index 000000000..aabf0542d
--- /dev/null
+++ b/website/src/css/scrollbar.css
@@ -0,0 +1,61 @@
+/* ============================================
+   Custom Scrollbar Styling - VoltAgent Brand
+   Issue #1157
+   ============================================ */
+
+/* Light Mode Scrollbar */
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+::-webkit-scrollbar-track {
+  background: rgba(0, 0, 0, 0.05);
+  border-radius: 4px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: rgba(16, 185, 129, 0.3);
+  border-radius: 4px;
+  transition: background-color 0.2s ease;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: rgba(16, 185, 129, 0.5);
+}
+
+::-webkit-scrollbar-corner {
+  background: transparent;
+}
+
+/* Dark Mode Scrollbar */
+html[data-theme="dark"] ::-webkit-scrollbar-track {
+  background: rgba(255, 255, 255, 0.05);
+}
+
+html[data-theme="dark"] ::-webkit-scrollbar-thumb {
+  background: rgba(16, 185, 129, 0.25);
+}
+
+html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
+  background: rgba(16, 185, 129, 0.45);
+}
+
+/* Firefox Support */
+html {
+  scrollbar-width: thin;
+  scrollbar-color: rgba(16, 185, 129, 0.3) transparent;
+}
+
+html[data-theme="dark"] {
+  scrollbar-color: rgba(16, 185, 129, 0.25) rgba(255, 255, 255, 0.05);
+}
+
+* {
+  scrollbar-width: thin;
+  scrollbar-color: rgba(16, 185, 129, 0.3) transparent;
+}
+
+html[data-theme="dark"] * {
+  scrollbar-color: rgba(16, 185, 129, 0.25) rgba(255, 255, 255, 0.05);
+}
\ No newline at end of file