To offer what's called «vertical rhythm», the typography and spacing is based on a grid of 8px. This gives every component or page a clean and structured look and feel, with barely any effort.
Because of the way the CSS line-height calculation works, it's not possible to have a baseline grid. Instead, the vertical rhythm is achieved by having a vertical grid similiar to a grid that works horizontally, in «grid sizes» of 8px, 16px, 24px, 32px and so on.
For every font-size in use, a line height has to be chosen which is a power of 8. To make this easier, the root font-size on <html> is set to 8px. With that, the line-height can be set using integer rem values.
Because 1rem equals 8px, using any integer value will keep the vertical rhythm intact. It's also possible to use 0.5rem, in that case the missing 4px have to be added somewhere else, like via padding, if you use margin.
Sometimes this can get complicated, for example when an image has a height of 155px, missing 5px. If it's possible, try to use it as a background-image instead, where you can set a height of 20rem. Otherwise, you can add the missing 5px with margins.
Not everything will look great just because it follows a grid. It's totally fine to break the rules, as long as it improves the visual appearance. If you feel something needs some adjustments, try to keep the vertical rhythm intact by using transform: translateY() to move something up or down. That way, the adjustments don't alter the flow.