Size
Size Tokens are pre-defined sizes for visual elements and containers, ensuring consistency and harmony throughout the user interface. The size tokens are used to define the size of elements, applied for example on the width and height properties.
Size
| Token | value | PX (rem) |
|---|---|---|
size-8 | dimension-8 | 8px (0.5rem) |
size-12 | dimension-12 | 12px (0.75rem) |
size-16 | dimension-16 | 16px (1rem) |
size-20 | dimension-20 | 20px (1.25rem) |
size-24 | dimension-24 | 24px (1.5rem) |
size-40 | dimension-40 | 40px (2.5rem) |
size-80 | dimension-80 | 80px (5rem) |
size-272 | dimension-272 | 272px (17rem) |
size-416 | dimension-416 | 416px (26rem) |
size-448 | dimension-448 | 448px (28rem) |
size-480 | dimension-480 | 480px (30rem) |
size-600 | dimension-600 | 600px (37.5rem) |
size-872 | dimension-872 | 872px (54.5rem) |