Variables & Collections
Variables are reusable design tokens that let you define and manage values across your Webflow projects. They enable you to create a single source of truth for common values like colors, spacing, and typography. When you update a variable’s value, that change automatically propagates everywhere the variable is used, making it easy to maintain consistency and make global design updates.
Variable collections
Variable collections provide an organizational structure for managing related variables. Collections enable you to group variables logically - for example, you might create separate collections for brand colors, typography, or spacing variables.
Variables
Webflow supports five different types of variables, each with their own syntax for creating and updating them. Once you’ve created a variable, you can use it in your project by assigning it to a style property.
Define colors.
Define sizes and spacing.
Define fonts.
Define number.
Define percentages.