Tools.ly
العربية
Color & design Works offline

Font Viewer

Preview any font installed on your device with your own text, size, weight, spacing and colors — including a proper right-to-left sample for Arabic.

By Tools.ly Team Published

Sphinx of black quartz, judge my vow.

Waterfall

72px

48px

36px

28px

22px

18px

16px

14px

12px

Paragraph

Computed font size
—
Computed line height
—
Computed letter spacing
—
Resolved family
—

Generated CSS

—

No fonts are downloaded. This page only previews families already installed on your device, so it keeps working without a network connection.

How to use the font viewer

Type or paste the text you want to judge — your own headline, a product name, a line of Arabic — then set the family and adjust size, weight, line-height and letter-spacing while watching the specimen above. The waterfall underneath renders the same line at nine descending sizes so you can see exactly where the typeface stops being comfortable to read. Everything updates as you move a slider, and nothing is sent anywhere.

What the specimen shows

The large line is for character: letterforms, contrast, the shape of the numerals. The waterfall is for decisions — it answers "what is the smallest size I would set this at?" faster than any amount of theory. The paragraph block is for rhythm: a typeface that looks superb at 72 px can be exhausting at 16 px if its counters are small or its x-height is low, and only running text reveals that.

Bilingual preview for Arabic, Persian and other RTL scripts

Right-to-left scripts need more than a different font. They need the correct base direction, because that governs where the line starts, how punctuation is placed and how numbers behave inside the sentence. The direction switch sets dir on the specimen, so the Arabic sample renders as it would in a real Arabic layout rather than being pushed through a Latin left-to-right flow.

Not every typeface ships Arabic glyphs. When you pick one that does not, the browser falls back to a family that does — which is the correct and expected behaviour, not a bug in the tool. If you need a guarantee, specify a fallback chain yourself in the custom field, for example 'Noto Naskh Arabic', 'Segoe UI', Tahoma, sans-serif.

System fonts vs downloaded web fonts

A web page can display a font in two ways: it can ask the visitor's device for a family it already has, or it can download a font file. This page only does the first. That is a deliberate choice — remote font requests are the single most common third-party dependency on modern sites, they leak a request to another company on every page view, and they add a visible delay before text appears.

The trade-off is honest: you can only preview what is installed on the device you are using. A font installed on your desktop may be absent on your phone, and any family you have not installed simply will not appear. To preview a specific downloaded font file, install it locally, or load it on a page of your own and copy the CSS rule into the custom field here.

A short checklist for choosing type

  • Size first. Pick the body size that is comfortable, then choose the font — not the other way round.
  • Line-height for reading. Long paragraphs usually need 1.4 to 1.7; headings can sit much tighter.
  • Letter-spacing sparingly. Large capitals benefit from a little extra tracking; body text almost never does.
  • Weight is not a fix for size. If text is hard to read, making it bolder rarely helps as much as making it bigger.
  • Test the real language. A pangram in English tells you nothing about how the typeface handles Arabic, Cyrillic or diacritics.

Frequently asked questions

Why can I not see a font I have installed?

This tool does not enumerate the fonts on your machine — browsers deliberately block that, because it would let a website fingerprint your device. Type the font's family name into the free-text field instead and the browser will use it if it is installed.

Does this page load fonts from the internet?

No. There are no Google Fonts or other remote font requests anywhere on this page, which is why it works offline. The trade-off is that you can only preview fonts that already exist on your device, or families you have loaded yourself elsewhere.

Why does the Arabic sample look wrong in some fonts?

Not every typeface includes Arabic glyphs, and of those that do, not all include proper contextual shaping. If the Arabic sample appears as separated or missing characters, the font simply does not support Arabic — the browser falls back to a font that does, which is the correct behaviour.

What is the waterfall for?

A waterfall renders the same line at a descending series of sizes so you can judge where a typeface stops being readable. It is a quick way to decide the smallest size you would be comfortable setting body text in.

Sources & further reading