InfoCurrent ThemeDefault

This is an example showing how to easily implement dynamic themes into an Ionic app. We could use the setProperty method, but you'll notice that we can pass a style object into the IonApp component - I feel like we have more control this way. With this in mind, we can utilise all of the Ionic color CSS variables and custom variables.

Check out the setTheme function

I haven't over-rode every possible Ionic CSS variable, just a few of the core visually noticeable ones for this example.

Switching themesUsing global state

We now know that our overall theme is controlled via a style object, so we can easily store this in state. In this example I'm using Pullstate, and updating the "currentTheme" on each change. I've mimicked an API call from local JSON data, as if it were a customer/client theme or branding.

View Themes →
InfoThemesExamples