The styles defined in the style manager are intended for applying manually during page editing. Unfortunately, they cannot be applied dynamically (by user action or programmatically in the browser.) So, no magic trick (I know of, or have seen in many years on this forum) to simply change the style of a widget from StyleA to StyleB to StyleC, etc. in the protype (with the exception of using Interaction Styles, but that is limited to 2 or 3 styles only (Normal, Selected, Disabled; and in RP10, Error.) With 20 themes, you’re in for a fair bit of work in Axure, but it is doable. Depending on your needs, it will be either a lot of work or a LOT of work. Either way, you’re going to need to style all your widgets beforehand. I’ve had to do things like this in the past and can share some tips and tricks to suit your needs. It would be best if you could post a sample .rp file or some sketches even, to demonstrate or describe your setup and what details you need.
Not quite sure what you mean by this… but–in the editor–you can change styles in the Style Manager, or Style pane directly, by referring to the named style. Typing the first few chars in the Search bar helps find styles easier.
This just isn’t one of Axure’s strong points, though. Other prototype tools, like Figma, have plugins that support swapping color and style themes much easier. Using HTML+CSS is better suited for this, too. If you can make or get CSS sheets for your style themes, you can apply these as a plugin to an Axure prototype published on Axure Cloud. More on this below…
There are some ways to make switching styles/themes easier in Axure. This post describes some approaches. For your need of 20 different styles, look at the second method that uses dynamic panel states…
If your prototype is for something like a style guide or spec, and just need to show all website elements on a page, then you’re probably just as well off to create one page that looks and works correctly, then duplicate it 20 times and apply your different styles on each page. If you want to show your theme change more immediately (instead of after a page load where everything goes blank then loads) you can have one page with all your content in a dynamic panel, and one panel state per style. You can use a button, a droplist, and/or keyboard shortcut to change panel states and see the different style immediately or after a nice animated transition (using the options in the Set Panel State action.
If you have multiple instances of widgets, like several buttons on a page, or across different pages, you can save some time and effort by creating Master widget(s) with your built-in styles, one per state, so 20 states per widget/dynamic panel. Then you can change style by setting the dynamic panel to that style’s state, or cycle through them by setting it to “Next, wrap”.
Here are some potential resources if you can use Axure Cloud and know CSS or can get help from a developer on this. If you can’t use Axure Cloud, it is also possible to inject the CSS and/or Javascript code directly into a prototype. It works, but it is not supported by Axure, so you’re on your own with that (although forum users can help.) Search the forum for “injection” to see some ways to do this.
Here is the RP9 reference for using CSS and Javascript plugins on Axure Cloud:
Here is the RP9 reference for extracting CSS properties, which can help you get the CSS needed for the styles you’ve already defined in the Style Manager:
I haven’t tried this out yet, but this could be a way to use CSS styles easier in Axure.