Web Font Size px em
Converts font size in pixels to em rem and relates with current web standards.
—
Web font sizes in px, em & rem
Every major browser starts you off with a root font size of 16px. That value comes from the user agent stylesheet, applied to the <html> element. The relative units build on top of it. 1rem = 16px because rem is the root em and stays anchored to html no matter where you use it. 1em, on the other hand, tracks the computed font size of the parent, which means em compounds as you nest containers while rem never surprises you.
CSS3 standardised the unit at the same time as vw/vh and the font-size-adjust property. In Tailwind, text-base maps to 1rem (16px) and text-sm to 0.875rem (14px). That 14px lines up with the WCAG AA recommended floor for body copy.
Applications
On mobile, keep body text at 16px or larger so iOS Safari doesn't auto-zoom when someone taps an input. On desktop, 14–18px reads well for paragraphs. Set headings in rem so a reader's zoom preference flows through cleanly. The pieces that gain the most from holding the 16px baseline are form inputs, modal copy and primary calls-to-action.
FAQ
Should I use px, em or rem? Reach for rem on typography and layout spacing, since that keeps user zoom working. Use em when you want something to scale relative to its own component, like padding inside a button. Save px for hairline borders or fixed icon sizes.
Why does iOS zoom my input on focus? The computed font-size on that input has dropped below 16px. Bump it back up with font-size: 16px and the auto-zoom goes away, with no effect on your layout.
What's the minimum accessible size? WCAG AA points to 14px for body text, with 18px (or 14px bold) counting as large text under the contrast rules. Drop below 14px and you make life harder for low-vision readers, plus you start picking up Lighthouse warnings.
Related Tools
Rent Adjustment Calculator
Compute annual rent adjustment by IGP-M or IPCA accumulated in the last 12 months (manually configurable).
Pregnancy Calculator
Compute estimated due date (EDD), gestational age and trimester from the last menstrual period (LMP).
Fertile Period Calculator
Compute fertile window and ovulation day from the first day of the last cycle and the average cycle length.