Font Showcase

A quickly made site for me to keep track of some of the fonts that I enjoy and might want to easily use in various projects.
These fonts are offered in TTF and WOFF2 formats, CSS rules are also available. This should be good enough both for importing into your OS, as well as for your websites.
The goal for this is to serve as my personalized font repository, which might just urge myself and maybe others to use Google Fonts less frequently.

Input preview text

You can input the preview text here and also specify its size to use for display. Bold and italic options will load font variations, instead of using the browser functionality.

Note: you need JavaScript enabled for these.

Serif fonts

Typically you'd use serif fonts for all sorts of print media, like documents.

Liberation Serif

One of the fonts that are included with LibreOffice and that is metrically compatible with Times New Roman. This font family has a serif, sans-serif and monospaced variation.

Download 7z | Open CSS | File sizes (TTF: 385 KB, WOFF: 206 KB, WOFF2: 144 KB)

font-family: 'Liberation Serif', serif; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

PT Serif

Originally developed for slavic languages, these fonts have a slightly old timey look. This font family has a serif, sans-serif and monospaced variation.

Download 7z | Open CSS | File sizes (TTF: 211 KB, WOFF: 111 KB, WOFF2: 85 KB)

font-family: 'PT Serif', serif; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

FreeSerif

One of the free fonts provided by the GNU project, focused on wide character support. This font family has a serif, sans-serif and monospaced variation.

Download 7z | Open CSS | File sizes (TTF: 3227 KB, WOFF: 1781 KB, WOFF2: 1246 KB)

font-family: 'FreeSerif', serif; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

Sans serif fonts

Typically you'd use sans serif fonts for digital media, like websites.

Open Sans

One of the more boring and popular fonts, that's usually a safe default choice for most webpages.

Download 7z | Open CSS | Open CSS (all weights) | File sizes (TTF: 127 KB, WOFF: 77 KB, WOFF2: 59 KB)

font-family: 'Open Sans', sans-serif; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

Liberation Sans

One of the fonts that are included with LibreOffice and that is metrically compatible with Arial. This font family has a serif, sans-serif and monospaced variation.

Download 7z | Open CSS | File sizes (TTF: 402 KB, WOFF: 205 KB, WOFF2: 144 KB)

font-family: 'Liberation Sans', sans-serif; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

PT Sans

Originally developed for slavic languages, these fonts have a slightly old timey look. This font family has a serif, sans-serif and monospaced variation.

Download 7z | Open CSS | File sizes (TTF: 273 KB, WOFF: 149 KB, WOFF2: 111 KB)

font-family: 'PT Sans', sans-serif; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

FreeSans

One of the free fonts provided by the GNU project, focused on wide character support. This font family has a serif, sans-serif and monospaced variation.

Download 7z | Open CSS | File sizes (TTF: 1521 KB, WOFF: 785 KB, WOFF2: 562 KB)

font-family: 'FreeSans', serif; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

Monospaced fonts

Typically you'd use monospaced fonts for displaying code.

Liberation Mono

One of the fonts that are included with LibreOffice and that is metrically compatible with Courier New. This font family has a serif, sans-serif and monospaced variation.

Download 7z | Open CSS | File sizes (TTF: 313 KB, WOFF: 174 KB, WOFF2: 124 KB)

font-family: 'Liberation Mono', monospaced; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

PT Mono

Originally developed for slavic languages, these fonts have a slightly old timey look. This font family has a serif, sans-serif and monospaced variation. This font has only one variation (no separate bold, italic).

Download 7z | Open CSS | File sizes (TTF: 166 KB, WOFF: 90 KB, WOFF2: 69 KB)

font-family: 'PT Mono', monospaced; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

FreeMono

One of the free fonts provided by the GNU project, focused on wide character support. This font family has a serif, sans-serif and monospaced variation.

Download 7z | Open CSS | File sizes (TTF: 571 KB, WOFF: 296 KB, WOFF2: 202 KB)

font-family: 'FreeMono', serif; font-weight: normal; font-style: normal; font-size: 16px;

The quick brown fox jumps over the lazy dog,.!? 1234567890 {}[]()@#$%^&*-=_+\/<> Common issues: lLiI1oO0 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. var userOwnsDoc = document != null && document.getUserId() != null && user != null && user.getId() !== null && Objects.equals(document.getUserId(), user.getId());

Note on optimization

Please note that these fonts are not optimized as far as possible, because you could split them up based on different character sets.
You could then download them as multiple smaller files, for example, you'd need fewer files if your page doesn't contain cyrillic characters, even if the font supports them.
For an example of this, have a look at how Google Fonts offers you to get Open Sans. I like it conceptually, but it's a bit of a pain to set up. Good luck figuring out how to split fonts like that yourself.