diff --git a/src/platforms/h5/components/app/tabBar.vue b/src/platforms/h5/components/app/tabBar.vue
index 04dc86580b62536380c0253760cec586bf9bcb4e..e62521018f6fe43e251365a192f9afb3da546058 100644
--- a/src/platforms/h5/components/app/tabBar.vue
+++ b/src/platforms/h5/components/app/tabBar.vue
@@ -44,7 +44,7 @@
             <div
               v-if="item.iconfont"
               :style="{
-                color:selectedIndex === index ? selectedColor : color,
+                color:selectedIndex === index ? item.iconfont.selectedColor : item.iconfont.color,
                 fontSize: item.iconfont.fontSize || iconWidth
               }"
               class="uni-tabbar__iconfont"
diff --git a/src/platforms/h5/service/api/ui/tab-bar.js b/src/platforms/h5/service/api/ui/tab-bar.js
index 294c8cecb7038178ec46c5fd711c806e3afc05b7..a97db85ba766e4f2a5fe2b6e7ae85835cd57997b 100644
--- a/src/platforms/h5/service/api/ui/tab-bar.js
+++ b/src/platforms/h5/service/api/ui/tab-bar.js
@@ -8,6 +8,8 @@ const setTabBarStyleProps = ['color', 'selectedColor', 'backgroundColor', 'borde
 
 const setTabBarBadgeProps = ['badge', 'redDot']
 
+const setTabBarIconfontStyles = ['text', 'selectedText', 'fontSize', 'color', 'selectedColor']
+
 function setTabBar (type, args = {}) {
   const app = getApp()
 
@@ -43,7 +45,11 @@ function setTabBar (type, args = {}) {
       case 'hideTabBar':
         app.$children[0].hideTabBar = true
         break
-      case 'setTabBarItem': {
+      case 'setTabBarItem': {
+        if (args.iconfont) {
+          setProperties(tabBar.list[index].iconfont, setTabBarIconfontStyles, args.iconfont)
+          args.iconfont = tabBar.list[index].iconfont
+        }
         setProperties(tabBar.list[index], setTabBarItemProps, args)
         const pagePath = args.pagePath
         const route = pagePath && __uniRoutes.find(({ path }) => path === pagePath)