diff --git a/themes/matery/components/MenuItemCollapse.js b/themes/matery/components/MenuItemCollapse.js
index 6cd373f6..0094fa86 100644
--- a/themes/matery/components/MenuItemCollapse.js
+++ b/themes/matery/components/MenuItemCollapse.js
@@ -72,7 +72,7 @@ export const MenuItemCollapse = ({ link }) => {
             return (
               <div
                 key={index}
-                className='cursor-pointer whitespace-nowrap dark:text-gray-200  w-full font-extralight dark:bg-black text-left px-5 justify-start bg-gray-100  hover:bg-indigo-700 hover:text-white dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
+                className='cursor-pointer whitespace-nowrap dark:text-gray-200  w-full font-extralight dark:bg-black text-left px-5 justify-start bg-gray-100  hover:bg-indigo-500 dark:hover:bg-indigo-500 hover:text-white tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
                 <Link href={sLink.to} target={link?.target}>
                   <span className='text-sm'>
                     <i className={`${sLink.icon} w-4 mr-3 text-center`} />
diff --git a/themes/matery/style.js b/themes/matery/style.js
index 711670c9..32918e92 100644
--- a/themes/matery/style.js
+++ b/themes/matery/style.js
@@ -5,27 +5,54 @@
  * @returns
  */
 const Style = () => {
-  return <style jsx global>{`
-    // 底色
-    body{
-        background-color: #f5f5f5
-    }
-    .dark body{
+  return (
+    <style jsx global>{`
+      // 底色
+      body {
+        background-color: #f5f5f5;
+      }
+      .dark body {
         background-color: black;
-    }
+      }
 
-    /* 设置了从上到下的渐变黑色 */
-    #theme-matery .header-cover::before {
-        content: "";
+      /* 设置了从上到下的渐变黑色 */
+      #theme-matery .header-cover::before {
+        content: '';
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
-        background:  linear-gradient(to bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.2) 10%, rgba(0,0,0,0) 25%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0.5) 100%);
-    }
-    
-  `}</style>
+        background: linear-gradient(
+          to bottom,
+          rgba(0, 0, 0, 0.5) 0%,
+          rgba(0, 0, 0, 0.2) 10%,
+          rgba(0, 0, 0, 0) 25%,
+          rgba(0, 0, 0, 0.2) 75%,
+          rgba(0, 0, 0, 0.5) 100%
+        );
+      }
+
+      // 自定义滚动条
+      ::-webkit-scrollbar {
+        width: 5px;
+        height: 5px;
+      }
+
+      ::-webkit-scrollbar-track {
+        background: transparent;
+      }
+
+      ::-webkit-scrollbar-thumb {
+        background-color: #4338ca;
+      }
+
+      * {
+        scrollbar-width: thin;
+        scrollbar-color: #4338ca transparent;
+      }
+    `}</style>
+  )
 }
 
 export { Style }