diff --git a/app/layouts/admin/sidebar.tsx b/app/layouts/admin/sidebar.tsx
index 654318c..a43dda2 100644
--- a/app/layouts/admin/sidebar.tsx
+++ b/app/layouts/admin/sidebar.tsx
@@ -17,10 +17,12 @@ export const Sidebar = () => {
             <Link
               to={url}
               key={`${group}-${title}`}
-              className="group/menu hover:bg-opacity-10 flex h-[42px] w-[200px] items-center gap-x-3 rounded-md px-5 text-[#273240] hover:bg-[#707FDD]/10 hover:font-bold hover:text-[#5363AB]"
+              className="group/menu hover:bg-opacity-10 flex h-[42px] w-[200px] items-center gap-x-3 rounded-md px-5 transition-all hover:bg-[#707FDD]/10 hover:font-bold hover:text-[#5363AB]"
             >
-              <Icon className="h-[18px] w-[18px] text-[#A6ABC8] group-hover/menu:text-[#5363AB]" />
-              <span className="group-hover/menu:text-[#5363AB]">{title}</span>
+              <Icon className="h-[18px] w-[18px] text-[#A6ABC8] transition-all group-hover/menu:text-[#5363AB]" />
+              <span className="text-[#273240] transition-all group-hover/menu:text-[#5363AB]">
+                {title}
+              </span>
             </Link>
           ))}
         </div>