Size and spacing

As much as possible, size and spacing should be a multiple of 4px. This is obviously not always applicable, but let's look at an example with the primary button.

its height is 40px, width is variable depending on the icon and label, so it's not applicable.
in this case the button height dictates vertical spacing (label and icon are be vertically aligned to the container), so we are not able to apply the rule
we still can decide spacing between the side borders and between icon and label, so we go with a 12px spacing from the borders, and 8px spacing between the icon and the label

As you can see from the example, there are some measures that follow the 4px rule, and some that don't. The ones that don't are dependent on constraints that don't allow us to apply the rule.

Home

Development environment setup

Contributing

Development

Testing

Releasing

Specific features

Data and APIs

Instance-specific configuration

External services

Design