diff --git a/src/components/Partials/Sidebar.jsx b/src/components/Partials/Sidebar.jsx
index b36d1f6..3d0a4d7 100755
--- a/src/components/Partials/Sidebar.jsx
+++ b/src/components/Partials/Sidebar.jsx
@@ -145,7 +145,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
                     }`}
                   >
                    Reminders
-                    <span className="absolute left-24 -top-1 text-sm flex justify-center items-center w-5 h-5 primary-gradient rounded-full text-white">
+                    <span className={`absolute left-24 -top-1 text-sm flex primary-gradient justify-center items-center w-5 h-5 rounded-full text-white dark:text-purple ${'dark' ? 'dark-primary-gradient' : ''}`}>
                       {userReminders.length > 0 && userReminders.length}
                     </span>
                   </span>
diff --git a/src/index.css b/src/index.css
index c990ed6..59e70ae 100755
--- a/src/index.css
+++ b/src/index.css
@@ -47,6 +47,10 @@ html {
   background-size: cover; */
 }
 
+.dark .dark-primary-gradient {
+  background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(188,73,190,1) 100%);
+}
+
 .primary-home {
   /*background: linear-gradient(134.38deg, #f539f8 0%, #284f64 43.55%, #1a3544 104.51%); */
   background-image: url("./assets/images/left-myft.jpg");