You can quickly view and edit the styles used throughout your page. For more information on how to manage styles, check out this article: Managing Styles.
Viewing Styles
To view styles used on the page, click on “Page” in the Layers panel to see the styles.
They are categorized by type (e.g., Text, Stroke, Button, etc.).
Next to each style name, you'll see the number of instances where that style is used on the page
Note: You can also view the styles used in a specific block or component. Just click on the block/component in the Layers panel to view them.
Editing Styles
Hover over a particular style, and you'll see one or two options depending on whether the style has been previously saved:
Unsaved Style
You can click the “four circles” icon to save it. Name your style and save it for future use.
To edit the style, click the “pencil” icon.
Saved Style
The “pencil” icon allows you to edit the style’s name and parameters.
Once you’ve made changes, you can either click the “undo” icon if you're unsatisfied, or click “Save changes.”
When you save, all instances of that style on the page will update automatically.
Note: If any style has unsaved changes, a blue-green dot will appear to indicate this.
Detaching Styles
If you'd like to detach one instance of a style, edit it, and save it as a new style, click the “unchain” icon next to the style's name.
