Create and edit styles

Styles are reusable collections of properties that you can apply to elements in your designs. You can create styles for:

• Colors: Fill, stroke, image, gradient, pattern, shader fill
• Text: Font family, size, line height, spacing
• Effects: Drop shadow, inner shadow, layer blur, background blur, texture, noise, shader effect
• Layout guides: Row, column, grid
• Animations: Position, scale, rotation, size, opacity, path

From local styles

Local styles are style definitions that exist in the current file. You can access local styles from the right sidebar when nothing is selected, or from the style picker when an object is selected.

To create a new local style:

1. In the right sidebar, click the plus next to Local styles.
2. Select a style type from the dropdown menu.
3. Give the style a name and description, then use the settings to configure the style properties. Descriptions display when hovering over the style in the style picker.
4. Click Create style.

Create styles from an existing object

1. Select the object you’d like to create a style from.
2. In the right sidebar, click Apply styles or variables next to the section corresponding to the style type you want to create.
3. Click New style or variable in the style picker.
4. Give the style a name and description, then use the settings to configure the style properties. Descriptions display when hovering over the style in the style picker. You can click the minus next to individual properties to remove them from the style.
5. (Optional) To make finding and selecting styles easier, you can organize styles into folders. Learn more about naming, managing, and sharing styles.