diff --git a/entry/src/main/ets/pages/Index.ets b/entry/src/main/ets/pages/Index.ets
index 2619a9e..8d66be4 100644
--- a/entry/src/main/ets/pages/Index.ets
+++ b/entry/src/main/ets/pages/Index.ets
@@ -17,22 +17,22 @@ struct Index {
       TabContent() {
         HomePage({ onGoLogin: () => { this.currentIndex = 3; } })
       }
-      .tabBar(this.tabBarBuilder(0, '首页', '🏠'))
+      .tabBar(this.tabBarBuilder(0, '首页', $r('app.media.home'), $r('app.media.home_active')))
 
       TabContent() {
         CheckinPage({ onGoLogin: () => { this.currentIndex = 3; } })
       }
-      .tabBar(this.tabBarBuilder(1, '打卡', '✅'))
+      .tabBar(this.tabBarBuilder(1, '打卡', $r('app.media.checkin'), $r('app.media.checkin_active')))
 
       TabContent() {
         PlanPage({ onGoLogin: () => { this.currentIndex = 3; } })
       }
-      .tabBar(this.tabBarBuilder(2, '计划', '📝'))
+      .tabBar(this.tabBarBuilder(2, '计划', $r('app.media.plan'), $r('app.media.plan_active')))
 
       TabContent() {
         ProfilePage()
       }
-      .tabBar(this.tabBarBuilder(3, '我的', '👤'))
+      .tabBar(this.tabBarBuilder(3, '我的', $r('app.media.profile'), $r('app.media.profile_active')))
     }
     .onChange((index: number) => {
       this.currentIndex = index;
@@ -43,10 +43,12 @@ struct Index {
   }
 
   @Builder
-  tabBarBuilder(index: number, title: string, icon: string) {
+  tabBarBuilder(index: number, title: string, normalIcon: Resource, activeIcon: Resource) {
     Column({ space: 2 }) {
-      Text(icon)
-        .fontSize(20)
+      Image(index === this.currentIndex ? activeIcon : normalIcon)
+        .width(24)
+        .height(24)
+        .objectFit(ImageFit.Contain)
       Text(title)
         .fontSize(AppFontSize.caption)
         .fontColor(index === this.currentIndex ? AppColor.tabActive : AppColor.tabInactive)