In short
Body text on the web should be at least 16px and is more comfortable at 17–19px for long-form reading, set in rem units so it respects the reader's browser preferences. Sixteen pixels is the browser default, the size below which iOS Safari zooms into form fields, and the practical accessibility floor. Larger x-height fonts can sit at the lower end; small x-height fonts need the upper end. Pair the size with a line height of 1.5–1.6 and a line length of 55–75 characters.
The short answer
16px minimum, 17–19px preferred for anything people will read at length. That range has been the working consensus since screens became high-resolution, and it is where most well-set sites sit in 2026.
The reasoning: screens are read at a greater distance than paper, typically 50–70 centimetres versus 30–40, so the same physical size of type looks smaller. The 10–12 point body text of print corresponds, at screen distance, to roughly 16–20 pixels. Below 16, reading speed drops and readers begin to zoom; above 20, lines become short and the page feels like large print.
Why 16 is the floor
It is the browser default. Every browser renders unstyled text at 16px, and every user who has changed their default has chosen a size relative to it. A site that sets 14px has decided its readers want smaller text than they chose.
iOS zooms below it. Safari on iPhone automatically zooms the page when a user focuses a form field whose text is smaller than 16px, so that the field is readable. It is a common and disorienting bug on sites with 14px inputs, and the fix is simply to use 16px.
Accessibility. WCAG does not mandate a minimum size, but it requires text to be resizable to 200% without loss of content, and small base sizes make that harder to satisfy. Readers with low vision, older readers, and readers on small phones all benefit from 16 or more.
Set it in rem
A pixel value ignores the reader's browser settings; rem respects them. 1rem is the root font size, which is 16px unless the reader has changed it, and it scales with their preference. Set html { font-size: 100%; } to preserve the default, then size body text as 1rem to 1.2rem and build the type scale in rem on top. A reader who has set their browser to 20px gets everything proportionally larger, which is exactly what they asked for.
Avoid the old trick of setting the root to 62.5% to make 1rem equal 10px; it fights the reader's preference and confuses every value in the system.
What changes on mobile
Less than people expect. Phones are held closer than laptops, which argues for slightly smaller text, but their screens are narrow, which argues against anything that makes lines shorter. In practice, keeping body text at 16–17px on phones and 17–19px on larger screens works well, and fluid sizing with clamp() lets the size move smoothly between them: font-size: clamp(1rem, 0.9rem + 0.4vw, 1.2rem) or similar.
Do not go below 16px on mobile to fit more in. Line length on a phone is already short; smaller text makes it shorter in characters only marginally while making it harder to read.
The font matters
Two fonts at 16px can look very different in size. Fonts with a large x-height, the height of the lowercase letters relative to the capitals, appear larger and can sit at the lower end of the range. Fonts with a small x-height, often the more elegant serifs, appear smaller and need 18 or 19px to read comfortably. When choosing a typeface, set a paragraph at the intended size and compare.
Size is one of three settings
Body text is comfortable when size, line height and line length are set together. The working values: 16–19px, 1.5–1.6 line height, 55–75 characters per line. Increase one and the others usually need adjusting. A page at 18px with 1.2 line height and 120-character lines is harder to read than one at 16px with the other two right.
The mistakes
14px body text, inherited from older design conventions and from frameworks whose defaults were set a decade ago. The single most common typographic defect on business sites.
Small text in inputs, triggering iOS zoom.
Pixel sizes everywhere, ignoring reader preferences.
Tiny "legal" text at 10–12px for content that is, in fact, legally required to be readable.
Large text as a substitute for hierarchy. 22px body text does not make a page more readable; it makes it longer. Hierarchy comes from the scale, not the base.
Practical defaults
For a content site: 18px body, 1.6 line height, 65-character measure. For a marketing site: 17px body, 1.5–1.6 line height. For an application interface: 16px body and 14px for dense secondary text, never smaller than 12px for anything a user must read. Set them once as tokens and let every component inherit them.
If your site's text is at 14px and nobody has questioned it, it is the quickest improvement available; if you would like the whole type system reviewed alongside, book a call.
Common questions
Is 16px too small for body text?
No; it is the sensible minimum and the browser default. It is comfortable for most fonts and most readers, and it is the size below which iOS zooms into form fields. For long-form reading, 17–19px is more comfortable, particularly with fonts that have a small x-height. Anything below 16px for body text should be avoided.
What is the best font size for mobile websites?
16–17px for body text. Phones are held closer than laptops but their screens are narrow, so smaller text shortens lines without much benefit and makes reading harder. Keep inputs at 16px or more to prevent iOS Safari zooming when a field is focused, and use fluid sizing to scale up smoothly on larger screens.
Should I use px, em or rem for font size?
rem. It is relative to the root font size, which respects the reader's browser preference, so text scales for people who have set larger defaults. Pixels ignore that preference; em compounds unpredictably through nested elements. Set the root to 100% and define the type scale in rem.
What font size do most websites use?
Well-set content sites typically use 16–19px for body text, with 18px common for long-form articles. Many business sites still use 14px, inherited from older frameworks, which is below the accessibility floor and the browser default. Application interfaces commonly use 14–16px for body with 12px as the smallest readable size.
Why does my iPhone zoom in when I tap a form field?
Because the field's text is smaller than 16px, and iOS Safari zooms so that the input is readable. Set the font size of inputs, selects and textareas to at least 16px and the zoom stops. Disabling zoom through the viewport tag is the wrong fix, as it removes zoom for everyone and fails accessibility.
