Creating Styles in Figma

   Let's figure out what styles are there in Figma?

• Color (element fill style)
• Effect (shadow, inner shadow, blur, etc.)
• Text (different text styles)
• Grid (if it's a frame or Layout grid, you can add a grid)

   To apply a style to an element, you first need to create it.

   How to create a style in Figma?

   Create a certain element, add a color fill to it. Now you need to associate this color with some color style name.

   To do this, click on the "style" panel (the icon with four dots) and click on "+", then give it a name.

   Now you can apply this style to any other elements, shapes, fill, frame, text.

   To change the color of the style or its name, you need to go to the style panel again and click on the "Edit style" icon.

   You can also structure color styles into folders if you put "/" in the name in the style panel.

   For example: Dark colors/brown

   There will be a folder called "Dark colors" and all the corresponding colors will be in it.

   If you change the color of a style, it will change accordingly in all the elements where it was used.

   The same logic works with other styles, with the same effects or text.

   We can apply several styles to the same element.

   Created styles can be transferred from one work to another. To do this, go to the layers panel (Assets) and click on the "book"  or ALT + 3.

   A window will appear in which we see our styles, click "Publish".

   Now these styles need to be pulled out of the common library where they were added.

   To do this, in your new work, go to the "Assets" tab ➡️ click on the "book" and select the file from which we will pull these styles (just turn on the slider).

   This is how you can create a certain set of styles and use them in your different projects and files.

   I would like to separately analyze the text styles.

   Let's try to create some text style.

   Select the "T" (Text) tool and create a text block on the workspace. Add the "+" style and the style name to it.

   Always remember that all font settings (the font itself, its font style, font size, letter spacing, line spacing, etc.) are pulled into the style.

   You can only operate with the position of the text inside the text block.

   You can apply not only a text style to the text, but also any other styles that are possible.