Ionic2: ion-tab , change icon color when active/inactive

Ionic Framework ionic-v3
1

Hi

I have a simple tab and I want that the 3 icons (md-search + md-pulse + md-people, not the ICONHOME one) use the red color when the tab is active, and light gray when the tab is inactive. Do you have any idea ?

<ion-tabs tabsPlacement="bottom" color="back" preloadTabs="false" #myTabs class="tabs-icon-top tabs-color-active-positive">
    <ion-tab [root]="tabHome" tabIcon="ICONHOME"></ion-tab>
    <ion-tab [root]="tabSearch" tabIcon="md-search" tabIcon="md-pulse"></ion-tab>
    <ion-tab [root]="tabActivity" tabIcon="md-pulse"></ion-tab>
    <ion-tab [root]="tabProfile" tabIcon="md-people"></ion-tab>
</ion-tabs>
2

$tabs-md-tab-color-active
$tabs-md-tab-color-inactive

3

Thanks a lot,

But I need different color (and maybe icons) for each tab/state.

Notice that I use material design icons, even on IOS ! Documentation stand that there is no outline version !

Is it possible ?

3 Likes