Create color, text, effect, and layout guide styles

Styles allow you to define a set of properties of an object, that can be reused across your designs.

Create styles for:

• Text: font family, size, line height, spacing
  • Text styles can be applied to an entire layer or portions of text. This is perfect for defining the styles of headers, body text, and text within paragraphs—such as linked text.
  • Because text styles can’t be created for text alignment, you must set alignment for each block individually.
• Colors: fill, stroke, image, gradient
  
  • When creating a style for a gradient, both the colors used and the gradient direction, or angle, will be saved to the style.

• Effects: drop shadow, inner shadow, layer blur, background blur
  • A style can include more than one effect and all applied properties will be saved to the style.
  • Shadow styles are represented as icons in the Effects section of the right sidebar and vary according to their direction. These icons can also vary between drop or inner shadows and their x, y values.
• Layout guides for frames: row, column, uniform grid
  • This is useful for replicating a specific format or structure across multiple designs.
  • Guide styles are represented as icons in the Layout guides section of the right sidebar and vary according to type: Uniform grid, Columns, or Rows. Learn more about layout guides.

From local styles

Local styles are style definitions that exist in the current file. You can access local styles in the right sidebar when nothing is selected, or from the style picker. Styles are grouped by type:

• Text
• Color
• Effect
• Layout guide

To create a new local style:

1. In the right sidebar, click next to Local styles.
2. Select the property you’d like to create a new style for.
3. Give the style a name and description and click Create style. Descriptions display when hovering over the style in the style picker.

From an existing object

1. Select the object or frame you’d like to create a style for.
2. In the right sidebar, click next to the section corresponding to the style you want to create.
3. Click in the style picker. In the Create new style modal, you can click Show more options to view and edit style properties.
4. Give your style a name and description and click Create style. Descriptions display when hovering over the style in the style picker.

To make finding and selecting styles easier, you can also organize your styles into folders. Learn more about naming, managing, and sharing styles.