Color is one of the most important elements of a landing page. Colors can affect our moods, influence perception, and create a certain impression of a brand. When designing a landing page, designers typically start by building a color palette and selecting colors that best fit the product or service and evoke the desired emotions. These colors are then used for various UI components such as buttons, tabs, and icons, as well as text and backgrounds.

However, manually applying colors to each element can be time-consuming and tedious. Color styles in Figma come in here as a lifesaver. Similar to text styles, color styles allow designers to create a set of tools, in this case, colors, that can be used and reused consistently throughout a design project.^[1] The benefits of using color styles include maintaining consistency, saving time and effort, and ensuring a strong visual identity that aligns with branding.

It's important to note that color styles in Figma can specify the color value, opacity, and blend mode but not other properties such as border thickness, border style, or shadow. These properties need to be specified separately for each object or text layer.