Course Content
UI/UX with Figma
UI/UX with Figma
1. Figma Basic Tools
2. Creating and Organizing Objects
Styles
Styles help organize colors and text in a project, eliminating the need to remember their properties. It is a fast way to organize your project.
- To create a color style, select an object, go to the Design Panel, click the Fill icon, then click the (+) icon to create a new style;
- Name the style and optionally add a description;
- You can apply styles by selecting the object, navigating to Fill, and clicking the four dots to access saved styles;
- Create text, go to Typography in the Design Panel, and click the four dots;
- Click + to create a new text style, name it, and set properties;
- Using the slash naming technique (e.g., Red/Brick and Red/Pastel) is very helpful if you want to organize the styles in groups. These grouped styles can be collapsed or expanded in the Local Styles panel;
- To modify a style, detach it (similar to detaching an instance) and apply desired changes;
- To delete a style, right-click the style in the Local Styles panel and select Delete.
1. What is the primary purpose of styles in Figma? (choose two)
2. What is the function of the slash naming technique in Figma?
Everything was clear?
Thanks for your feedback!
Section 3. Chapter 7