How to add custom CSS to Axure?

Ok, i have found some infor that i can inport HTML, CSS, JS to Axure prototype to extend its animations. But, i am confused on how to do that. Is there any detailed step-by-step guide on how to do that?

  1. You can add any of that in using AxShare plugins. https://www.axure.com/c/forum/axshare-general-discussion/9953-create-edit-plugin-axshare-tutorial.html

If you go that route they will only work if your prototype is hosted on AxShare.

  1. You can abuse the Open Link action to include javascript which you can then use to add your styles. In the Open Link action, choose “external URL” and then preface your script with “javascript: //your code here”. You’ll want to wrap your statement in a void call or throw new Error() at the end to make sure it works in different browsers.

  2. You can generate your files and then manually edit them to link to your styles. This isn’t ideal as you’ll to do so each time you generate them with updates.

  3. People on these forums have created libraries that make adding your own JS or CSS simpler, you can try those as well. I’ve personally not used them but it seems they work well.

Thank you for info. I did try that all but somehow didnt work (thats why i asked for some detailed/illustrated/video tutorial if there are any). Also, can you link that libraries? I will try it with those if it will manage to work there.

I don’t know of any specific tutorials for AxShare plugins beyond what I linked. It’s all just HTML and CSS. If you’re having trouble there is suggest searching for basic resources on those topics. You haven’t said what you’re having trouble with or what isn’t working so it’s hard to suggest anything specific.

Or if you can provide details on what isn’t working someone may be able to help you.

In brief I use the Web fonts door in the configuration.
In Axure 8 I open: Publish > Preview options. From there I click con Configure and then open Web Fonts panel. Here I click the “+” sign to add a new web font (make sure Include Web Fonts checkbox at the top is flagged) the choose Link to .css file and I place the full URL of a file available on one of my servers so it works both while testing locally and when I share the project on Axshare.
To be sure the rules in this file take precedence I also use !important for each rule.