Skip to content

How to use

A few features here are not obvious unless someone points them out. Here they are, page by page — two minutes and you will be using all of it.

Font library (home)

Category and script are single-select

The two rows of chips look multi-select, but only one chip per row is active at a time. Clicking another chip switches to it; "All" clears that row.

Note: The two rows combine with AND — you can ask for "Mono" AND "Traditional Chinese".

You can preview your own text

The field below the search box is not a second search — it is the preview text. Whatever you type is rendered on every card, so you can see your own brand name or tagline in each typeface.

Note: It applies about 0.5s after you stop typing (so every keystroke does not fire a request), and cards below the fold update as you scroll to them. Nothing is broken.

Filtered views are shareable

Filtering, searching and sorting all update the URL. Copy it and whoever opens it sees the same list.

The whole card is a link

You do not need to aim for the font name — clicking anywhere on the card opens its detail page.

Note: The star in the corner is the exception: it saves the font instead of navigating.

Fonts load as you scroll

To keep the page fast, each card downloads its typeface only as it approaches the viewport. When scrolling quickly you may briefly see a card swap from a fallback to the real font.

Font detail page

The demo site shows real layout

The mock browser window contains navigation, buttons, forms, tables and numerals so you can judge the typeface inside an actual interface.

Note: Those buttons and form fields are static samples on purpose — clicking them does nothing.

Switch the sample language

If a typeface covers more than one language, buttons appear to switch the sample between Japanese, Traditional Chinese and English. Single-language fonts show no switcher.

Copy the embed code

Near the bottom you get a ready-made HTML `<link>` and a CSS `font-family` declaration, each with its own copy button.

Previous / next wraps around

The buttons at the bottom cycle through every font in a fixed order and loop from the last back to the first.

Note: That order is site-wide and ignores whatever filter you had applied on the home page.

Font stack playground

What it does

It builds one font-family out of several typefaces. For each character the browser walks the list left to right and uses the first font that contains that glyph — which is why the order changes how mixed CJK/Latin text looks.

Note: The usual approach is Latin first, CJK second: Latin characters get the nicer Latin design and CJK falls through to the CJK font.

The preview is editable

The large text block in the middle can be typed into directly. Replace it with your own copy and the two comparison columns below follow along.

Reorder with the arrows

Each row in the stack has up, down and remove buttons. There is no drag and drop.

Stacks are shareable

Your stack is written into the URL as you build it. "Share this stack" copies the link, and opening it restores the exact same order.

Note: Only the font order travels in the URL — size and weight do not.

Quick presets overwrite your stack

The two preset buttons replace whatever you have assembled rather than adding to it.

The size slider only affects the preview

The two comparison columns stay at a fixed size so you can focus on the letterforms.

Saved fonts

Saved fonts live in your browser only

No account, no upload — the list is stored in this browser on this device. Switching devices or browsers, or clearing your browsing data, loses it.

Note: Multiple tabs in the same browser stay in sync instantly.

Save two to unlock side-by-side

With at least two saved fonts you get a 1:1 comparison: the same demo content on both sides, scrolling together so paragraphs always line up.

Language options narrow automatically

The sample language list only offers languages that BOTH selected fonts support, so options can disappear when you change a side.

Clearing takes two clicks

"Clear" first turns into "Clear them all?" — click again to confirm. It reverts on its own after five seconds.

Site preferences

Dark / light theme

Follows your system setting by default. Once you press the theme button, your choice wins from then on.

Language

Your first visit to the home page is redirected to match your browser language. Pick a language from the menu once and it stops redirecting.