Our UI uses a 24 column grid and is based on an 8-pixel module. That means that every space, width, and height is divisible by 8, and the distance between two elements is in increments of 8 pixels and increases as follows: 8, 16, 24, 32, and so on. In some use cases when 8 pixels is too much space, increments of 2 or 4 pixels can be used, but this should be the exception, not the rule.
The grid has an equal gutter and margin width of 24 pixels. Resizing the screen’s width does not affect the gutter and margin; the change occurs only to the column’s width. When using a side-menu, resizing will not affect the menu’s columns due to the nested grid.