Hello there !
Currently learning UI Toolkit coming from the standard Unity UI system and i would like to change an image/icon color that is inside a button when the button is pressed.
In the old system, i would go with animated transition and set all my parameters here but with UI Toolkit i can’t find a way to do it without code. I tried adding “:active” to my icon inside the button but it isn’t triggered.
Thanks in advance.
“:active” should be set in the button, not the icon. Something like this in your USS: .unity-button:active > .my-icon-class
Now, about changing color, if your icon is a background-image in some VisualElement, you can tint it with the -unity-background-image-tint-color USS property. Or you can change the image with the background-image USS property. You can see them in the Background section of this Documentation page.
Now, if your icon is an Image element, you need to use some custom USS properties to change it. Use the –unity-image USS property to set the image to be used by the Image element, just like the background-image property. Or you can use the –unity-image-tint-color USS property to tint it, just like the -unity-background-image-tint-color property.
Thanks ! That helped me a lot and i have achieved what i wanted
I had to create a new class that wouldn’t do anything to the current button but when active it would look for it’s children icon and change the color
Like this :
.menu-button {
//Style of my button
}
.menu-button:active {
//Style of my active button
}
.menu-button-with-icon {
//No modification
}
.menu-button-with-icon:active > .menu-button-with-icon--active {
//Style of my icon when button is active
}
And for the result 
