Font rendering
How Format handles font rendering and why it produces consistent output across all platforms.
Format forces -webkit-font-smoothing: antialiased on all documents. This ensures fonts render consistently between Studio and PDF generation.
What antialiasing does
When a browser draws text, it has to decide how to smooth the edges of each glyph against the background. There are two modes relevant here.
Grayscale antialiasing (antialiased) smooths edges using whole pixels with gray shades. Text appears slightly lighter and thinner.
Subpixel antialiasing (subpixel-antialiased) exploits the individual red, green, and blue subpixels of an LCD screen to simulate higher horizontal resolution. Text appears slightly bolder and is technically sharper on low-DPI screens. It relies on knowledge of the physical screen layout, which makes it inappropriate for a document format that will be viewed on many different displays and printed.
The macOS outlier
In macOS Mojave (2018), Apple disabled subpixel antialiasing across the operating system's own UI. The reason was straightforward: on modern high-DPI Retina displays, subpixel rendering offers no perceptible advantage and can actually make text look heavier than intended.
However, macOS web browsers were never updated to match. Chrome, Safari, and Firefox on macOS still default to subpixel antialiasing for web content. This means that on macOS, text in a browser appears noticeably bolder than on Windows, Linux, or any mobile platform, all of which already use grayscale antialiasing by default.
The property has no effect on non-macOS platforms. It only corrects the macOS browser outlier.
Why it matters for PDFs
If you design in Studio on a platform where the browser defaults to subpixel rendering, you see bolder text than what the PDF pipeline produces. Your font weights look heavier in the browser preview than in the final PDF.
Format eliminates this discrepancy. By forcing antialiased on all documents, Studio and the PDF pipeline render text the same way. What you see in the browser is what ends up in the PDF.
This also matches how design tools such as Figma render text, so your designs translate more accurately from mockup to document.
Further reading
- What's the deal with WebKit Font Smoothing? — David Bushell, 2024
- font-smooth — MDN
- Laissez-faire Font Smoothing and Anti-aliasing — Zach Leatherman