At My Fingertips

Rapid Playground

Documentation

Learn About Available Fonts

PyTamaro's PyTamaro icontext function allows you to produce a graphical representation of a text. To do so, it needs to use a font. The font determines the exact visual representation of each character.

Which Fonts?

The PyTamaro library supports arbitrary fonts. For PyTamaro to use a font, it needs to have access to that font. Fonts are stored in files.

If you use this PyTamaro Web site to run your programs, we installed a set of fonts on our server that you can use. (If you use the PyTamaro library on your computer instead, you can use any font that is installed on your computer. You probably already have propriatary fonts like Arial and many others. All the fonts we list here are available under an open license, so if you want, you can install them on your computer for free.)

This page provides the list of fonts you can use when programming in this web site. For each font, this page shows an example graphic rendered in that font, and it shows the corresponding code you can execute to produce that same graphic.

Proportional vs. Monospaced

A fonts can be proportional or monospaced. In a proportional font, different characters can have different widths. E.g., the letter "i" will be narrow, but the letter "w" will be wide. In a monospaced font, all characters have the same width.

ProportionalMonospaced.png

Why would one want to use a monospaced font? Isn't it ugly to have an "i" that is as wide as a "w"? Maybe, but monospaced fonts can be helpful in some situations. For example when showing tables of numbers with a monospaced font, the width of a number will be proportional to the number of its digits.

Proportional font:          Monospaced font:
10000001000000
11111101111110

Also, ASCII Art, where one uses characters to "draw" something, benefits from monospaced fonts:

Proportional font:          Monospaced font:
H...H EEEEE L.... L.... .OOO.H...H EEEEE L.... L.... .OOO.
H...H E.... L.... L.... O...OH...H E.... L.... L.... O...O
HHHHH EEEEE L.... L.... O...OHHHHH EEEEE L.... L.... O...O
H...H E.... L.... L.... O...OH...H E.... L.... L.... O...O
H...H EEEEE LLLLL LLLLL .OOO.H...H EEEEE LLLLL LLLLL .OOO.

In programming (like in the code cells of this page), we often use monospaced fonts because they allow a more regular horizontal alignment of text.

Serif vs. Sans-Serif

A serif is a little "decoration" at the end of a stroke in a character. A serifed font, like "Roboto Serif", uses serifs, while a sans-serif font, like "Roboto Sans", does not.

FontFaces.png

How to Look at a Font?

Before we produce and show any graphics, let's import the necessary names, and let's define the text we want to see.

What text should we use? Given that we want to see how the font looks, we would like to see all the characters of that font. We could use a string like "abcdefghijklmnopqrstuvwxyz". But this does not look anything like the normal English words we are used to. And we would like to see how the font looks for normal English text.

For this reason, people usually use a different string: "The quick brown fox jumps over the lazy dog". That string is a pangram of the English language: it contains all the letters of the English alphabet at least once.

Loading...

The Fira Family

Fira is a font family originally developed for the Firefox OS. You can freely download the Fira fonts from Google Fonts under the Open Font License.

Fira Sans

image.png

Loading...

Fira Code

image.png

Loading...

The Roboto Family

Roboto is a font family developed by Google as the system font for Android. You can freely download the Roboto fonts from Google Fonts under the Apache License, Version 2.0.

Roboto

image.png

Loading...

Roboto Serif

image.png

Loading...

Roboto Mono

image.png

Loading...

Roboto Condensed

image.png

Loading...

The IBM Plex Family

IBM Plex is a font family developed for IBM. You can freely download the IBM Plex fonts from Google Fonts under the Open Font License.

IBM Plex Sans

image.png

Loading...

IBM Plex Serif

image.png

Loading...

IBM Plex Mono

image.png

Loading...

The PT Family

PT is a font family developed by ParaType. You can freely download the PT fonts from Google Fonts under the Open Font License.

PT Sans

image.png

Loading...

PT Serif

image.png

Loading...

PT Mono

image.png

Loading...

The Ubuntu Family

Ubuntu is a font family developed for the Ubuntu (linux) project. You can freely download the Ubuntu fonts from Google Fonts under the Ubuntu Font License.

Ubuntu

image.png

Loading...

Ubuntu Mono

image.png

Loading...

Inter

Inter is a font family designed for computer screens. You can freely download the Inter fonts from Google Fonts under the Open Font License.

image.png

Loading...

Cormorant Garamond

Cormorant Garamond is a font family designed by Christian Thalmann, a type designer based in Zürich, Switzerland. It is inspired by the Garamond typeface. You can freely download the Cormorant Garamond fonts from Google Fonts under the Open Font License.

image.png

Loading...

Libre Bodoni

Libre Bodoni is a font family inspired by the Bodoni typeface. You can freely download the Libre Bodoni fonts from Google Fonts under the Open Font License.

image.png

Loading...

Jost

Jost is a font family inspired by 1920s German sans-serifs. You can freely download the Jost fonts from Google Fonts under the Open Font License.

image.png

Loading...

What You Learned

You learned that there are different font families, and that many families have fonts that are proportional and fonts that are monospaced, and fonts that have serifs and fonts that are sans serifs.

And you also learned about the idea of a pangram.


This activity has been created by LuCE Research Lab and is licensed under CC BY-SA 4.0.

Learn About Available Fonts

Logo of PyTamaro

PyTamaro is a project created by the Lugano Computing Education Research Lab at the Software Institute of USI

Privacy PolicyPlatform Version 754785f (Fri, 03 May 2024 12:21:44 GMT)