serif sans monospace fallback
The CSS2 specification, from 1998, defines five generic font families: serif, sans-serif, cursive, fantasy and monospace. This preview focuses on the three used most in product and documentation work, comparing a named font like Georgia side by side with the generic serif family it declares, to show what the browser picks when no named font is available at all.
Serifs help the eye track the baseline across long printed or digital blocks of text, so this pairing is the typical choice for articles and ebooks, never for short interface buttons or labels.
Without serifs, strokes stay more uniform at small screen sizes, which is why almost every button, menu and form label uses a sans-serif stack like this one instead of a serif family.
Column alignment is what lets two lines of code be compared side by side purely by horizontal character position, something impossible in a proportional font like Arial, where the letter "i" takes up far less space than the letter "m".
Because local fonts depend on the operating system, the user's installation and glyph support. If the main family is missing on the device, the browser uses the fallback and the appearance changes.
Because it is the only CSS specification guarantee that text renders in a font from the right category; without a generic family at the end, if every named font is missing, the browser's behavior for choosing a final font stops being predictable across implementations.
Yes, for any tabular content without an HTML table, like receipts, statements or numbers aligned by column in plain text, because the fixed width of every character reproduces the visual alignment that a proportional font can only fake with manually calculated spacing.
Rarely for serious product work: cursive and fantasy resolve to highly inconsistent decorative fonts across operating systems, so most professional style guides avoid both and concentrate their fallback strategy on serif, sans-serif and monospace, which behave far more predictably.
Because Georgia was designed in 1993 specifically for low-resolution screens, with reduced stroke contrast and a taller x-height, while Times New Roman was optimized for print in 1931 and tends to look thinner and tighter on ordinary monitors.
font-family: Inter, sans-serif;
font-size: 48px;
font-weight: 500;
font-style: normal;
letter-spacing: 0px;Text and family are rendered locally in the browser.