diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue
index 0ba7341c..602bf8c3 100644
--- a/src/layouts/MainLayout.vue
+++ b/src/layouts/MainLayout.vue
@@ -268,6 +268,10 @@ onMounted(async () => {
                 <span
                   class="text-caption cursor-pointer"
                   @click="item.handler?.()"
+                  :class="{
+                    'text-info': i !== utilsStore.currentTitle.path.length - 1,
+                    'hover-item': i !== utilsStore.currentTitle.path.length - 1,
+                  }"
                 >
                   {{
                     item.text
@@ -278,6 +282,9 @@ onMounted(async () => {
                   }}
                 </span>
                 <q-icon
+                  :class="{
+                    'text-info': i !== utilsStore.currentTitle.path.length - 1,
+                  }"
                   name="mdi-chevron-right"
                   v-if="i + 1 !== utilsStore.currentTitle.path.length"
                 />
@@ -558,4 +565,8 @@ onMounted(async () => {
 :deep(main.q-page) {
   min-height: 0 !important;
 }
+
+.hover-item:hover {
+  text-decoration: underline;
+}
 </style>