The html selector in question:
html {
box-sizing: border-box;
/* Set font size for easy rem calculations
* default document font size = 16px, 1rem = 16px, 100% = 16px
* (100% / 16px) * 10 = 62.5%, 1rem = 10px, 62.5% = 10px
*/
font-size: 62.5%;
scroll-behavior: smooth;
}
This isn’t defining the size of a rem in pixels per se, it’s defining one as 62.5% of its normal size of 16px (the default on all the major desktop browsers), so 10px. It’s a little bit strange that the style didn’t use absolute pixels to define the root font size, but even if other browsers define a root size other than 16px, they’ll scale everything the same, so it should all work out.
Using an absolute measurement in only one place with all other scales relative to that is the whole point of using rems. In this case, the author’s trying for a metric scale, at 10px per rem. Using an absolute unit like px means that if sizes are changed in one place, they have to be changed everywhere else.