Add icons or images to tabs

How can I add icons or images to tabs? I can add it nearly everywhere except in tabs. The same CSS commands that works in other places won’t work here.
For example:

Tab buttons are not accessible within the tabs’ scope, you need to target them from the parent’s css:

> inner > .navigation > .tablink:nth-child(1) {

Thanks for the response
I guess you mean this.
I created a panel, added 2 tabs. I would expect the tab number one change the background color, but nothing happens .
Also tried tab id and other background colors etc with no results.

I assumed you were using v1, you’ll need to adjust the css selectors (you can use the browser’s devTools to inspect the widget’s structure), If I remember correctly replacing inner with .panel should do.

Sorry, doesn’t seem to work either

> .panel > .navigation .tablink:nth-child(1) a {

Thanks! That works nicely.
How can I change the background color or the icon when the tab is active?
I know how to change the font color with this:
But can’t get it with background.
Obviously using icons would be nice to know how to change the icon or the icon filter when a tab is active.

.tablink elements have an extra class "on" when active, so you’d write `.tablink.on.

Thanks, can you add an example as you did with this?

.panel > .navigation .tablink:nth-child(1) a {


.panel > .navigation .tablink.on:nth-child(1) a {