Changing the color of text inside an ion-tab


I’m trying to change the text (ion-label) color inside an ion-tab-button (these are the generated tabs that come with the tabs template) when it’s pressed. I’m looking to do something very similar to what’s presented in this demo: Ion-Tabs: Tab-Based Component for App Top-Level Navigation

I’ve tried a few things, but none of them seem to work. Googling turns up questions about changing background colors, icon colors, etc, when a tab is active, but nothing about the text.

Have you looked at the documentation? It’s there.

I have. I don’t see it. Maybe I’m looking at the wrong page, or the wrong part of the page? Or perhaps I’m just misunderstanding what I’m looking at. I’'ve been reading a lot of documentation, so it’s totally possible I missed it. I don’t see anything about selected text color here: ion-tab-button: Ionic Framework API Docs, or here: Item Label Color and Properties for Applications | ion-label

it’s at the end, under the css custom properties.


Right, I’m asking how to change the color only when a tab is selected/active. I found this and was wondering if, perhaps, there’s a similar logic using ion-tab-button instead of ion-item:

Please don’t post textual information as images. It severely degrades the usability of forums like this.

The link @mikrochipkid provided contains the following line:

--color-selected Color of the selected tab button

I guess he just wants someone to write the code for him so he can copy and paste. :man_shrugging:t4: