system font stack
The most common system font stack on the web is -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif: seven names that cover macOS, Windows, Android and one final generic fallback. This previewer applies the full stack to your text and shows, without downloading a single font file, which entry actually answered on your own operating system.
None of these typefaces is downloaded over the network: every one already sits on the user's disk, so the text appears on first paint with none of the FOIT or FOUT delay typical of a web font loaded through @font-face.
Removing -apple-system and Roboto from the list forces macOS and Android to fall back to Arial, the universal safety font, which visually reveals the difference in average character width between the native typeface and the safety one.
Because no real installation has a font literally named "Fonte Inexistente 2026", the browser skips straight to the generic sans-serif keyword, which on Windows Chrome typically resolves to Arial and on macOS Safari to Helvetica.
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 -apple-system alone did not work in Chrome for macOS before 2016: the Blink engine required the BlinkMacSystemFont name to trigger the same San Francisco typeface that Safari already recognized through -apple-system, so keeping both names guarantees compatibility across browsers on the same operating system.
No: every typeface listed in a system stack already exists on the visitor's computer or phone, so the preview only applies the CSS font-family property and lets the browser pick among the fonts already installed, with zero network requests and zero download cost.
Arial works as the last named font because it ships on virtually every desktop operating system since Windows 3.1 in the early 1990s, which makes it a more predictable fallback than relying directly on the generic sans-serif keyword, whose resolved typeface varies from browser to browser.
Yes: because each operating system resolves to the same interface font its user already sees every day, the text inherits the hinting and spacing that vendor already tuned for both low and high density screens, which usually renders legibility equal to or better than an externally loaded web font.
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.