I had an issue with this as well so I sumbitted a support ticket with Mendix. The following solution works in our project:
“If you make sure the SVG doesn't have a color hardcoded inside it, it should be able to take the same color as a glyphicon.”
Thus, if you have an SVG without a color hardcoded (which you should be able to do in a editing program), and you put it for example as an SVG in your bottom navigation, you can alter the color of the icon or the selectedIcon:
export const navigationStyle = {
bottomBar: {
label: {
color: brand.appDesignInactive,
},
selectedLabel: {
color: brand.primary,
},
icon: {
color: brand.appDesignInactive,
},
selectedIcon: {
color: brand.primary,
},
},
}
Hope this helps you.
Kolien any update on SVG coloring in native apps?