How to set a primary or secondary color for Material design

Karb shared this problem 6 months ago
In Progress

Comments (8)

photo
1

This means we would like to set a primary color for the whole project instead replacing it for each element.

photo
1

Ideally the same could be done with fonts, etc.

photo
1

You can load the widget library you're using, then click on the 'gear' icon and click 'edit library'

009035f44a8654635d305e02324353b2

Then, click 'Edit all widgets', which will load all widgets to the Canvas in separate tabs

d7f58c80eb9b145db3ebfc02f993ed3a

Lastly, go to Edit -> Replace styles, and you'll be able to change the background color for the widgets, as well as their font styles/colors etc. Make sure to click 'Save all widgets' after you're done editing.

276ed3fcee1425115bf286d0f10d4911

photo
1

Thank you for the prompt answer. Sounds interesting. But are these settings across projects or only valid for the loaded project?

photo
1

Most of the widgets do not have the 'gear' icon. So it is not possible to edit them (eg. Android Components). How is it possible to edit these?

photo
1

You'll need to create a new widget library for those. Go to Widgets -> New Widget library -> Drag the Android Components widgets you're going to use into the new library. You'll then be able to edit them in bulk. These settings are valid across any project in which you load that widget library.

photo
1

Thank you that helps. But a better solution would be to define global style variables and assign them to elements. That would make prototyping much faster.

photo
1

Thanks for the feedback! I'll forward that along to our team.