Container Width
Container width variables define the widths of various containers used in your design. By setting these widths as variables, you can ensure consistent container sizing and easily adjust them to fit different design needs and screen sizes.
Column Grids
Column grid variables help structure your design layout by defining the grid system. These variables ensure that your designs are aligned and organized, providing a solid foundation for creating visually appealing and balanced layouts.
Spacing
Spacing variables manage the space between elements, such as padding and margins. Using these variables ensures consistent spacing throughout your design, which is crucial for creating a clean and cohesive look.
Border Radius
Border radius variables control the curvature of element corners. By standardizing these variables, you can maintain a consistent style for rounded corners across all components, enhancing the overall design harmony.
Border Width
Border width variables define the thickness of borders around elements. These variables help you maintain uniform border styles, which is important for creating a cohesive visual identity.
Size Units
Size units are standardized measurements used across your design system. These units, when repurposed as variables, provide a flexible and scalable approach to defining dimensions, ensuring that all elements are proportionally aligned and consistent.
