Spacing
Standardized spacing values help us create consistent user interfaces (UIs). This consistency makes it easier for customers to scan, browse, and utilize our UIs as we're setting visual rhythms and expectations that customers can rely upon.
Overview
Dialtone uses a spacing system based on a 4-pixel system, providing half-steps where deemed necessary. This 4px unit forms the base measurement unit for spacing in Dialtone.
CSS Variables
| Value | Pixel Equivalent | Actual output |
|---|
Less Variables
| Value | Pixel Equivalent | Actual output |
|---|
Utility Classes
Aside from the spacing variables, it may be necessary to use the following utility classes to manage interface spacing: