Width Preview

Width tokens are predefined values used to maintain consistent widths between elements, particularly within auto layout settings. They provide a standardised system for widths, ensuring uniformity and harmony across different components within a design project.

Widths Utilities

Token Name
Value, %
Class Example
Width Preview
--width-25
25%
.w-25
--width-33
33.3333%
.w-33
--width-50
50%
.w-50
--width-66
66.6667%
.w-66
--width-75
75%
.w-75
--width-100
100%
.w-100