How is this calculated?
This calculator converts px to rem.
Pixel value / default browser font size (16) = rem value.
Example: 20px / 16 = 1.25rem.
Why is the base 16 pixels
16 pixels is the default font-size on browsers and it is used as the base to do the conversion. However users able to change this default font size on their browser.
Why use REM instead of pixels?
Using REM over pixels would mean that your website is accessibile. This is because users are able to configure their default font to be something other than 16px. By using REM instead of pixels all the text on your website scales accordingly to support the user with the needs.
How do I change my default font size in my browser?
- Chrome: Go to Settings, Appearance, Customise fonts and finally Font size.