Leaflet Lab Notes

Fonts and footnotes!

Lab Notes 024: adding curated (and custom) typefaces to Leaflet theme options, and a whole new way to add footnotes (and sidenotes!) to posts

March 06, 2026

We hinted that we were dropping two F-bombs — a pair of long-awaited features — fonts (okay, typefaces) and footnotes!

Fonts

Leaflet now has six curated typefaces — our original favorite, iA Writer Quattro, plus:

  • Atkinson Hyperlegible Next

  • Lora

  • Monterrat

  • Sometype Mono

  • Source Sans 3

We have settings for both body and header font, so you can mix and match for just the right amount of contrast.

You can also add any custom font available on Google Fonts! Paste in the font name and we'll load it right in.

Examples
Leaflet posts with custom fonts!

Examples

Leaflet posts with custom fonts!

Software as Fan-Art - oh hey, it's owais
Dev Log 46: 2026-03-07
https://desertthunder.leaflet.pub/3mgi3w3lmxs2z

The Inner Life of Liberalism - Aaron Ross Powell’s Blog
The practices that make your life better are the same ones that sustain a free society. It's time liberalism took that seriously.
https://www.aaronrosspowell.com/3mhikjko2ws2a

My Opinion on the iPhone Air - maxine naomi lunaris ✦
https://max.leaflet.pub/3m7gdocum3c2z

The Daily Planet #128: War and the non-human world - The Daily Planet
https://dailyplanet.leaflet.pub/3mhgmgkv5us2i

Fun Google Fonts for headers!

Fun Google Fonts for headers!

  • Moo Lah Lah

  • Rubik Microbe

  • Schoolbell

  • Kablammo

  • Silkscreen

  • Flavors

  • Barriecito

  • Coral Pixels

  • Jim Nightshade

  • Comic Neue

The arbitrary Google Font option is particularly fun for adding funky header fonts. And useful if you need a font that better supports non-English scripts.

Paired with our existing theme options, you've not got more ways to be expressive in Leaflet and give your posts and pubs their own special flavor.

We tweaked font sizes a bit too, mainly bumping the header scale overall and adjusting base size for some of the fonts to more or less match better. Future idea: more settings for size and spacing…

Footnotes

One of our top editor requests. Add footnotes from the editor toolbar, and they show…in three places, actually!

  • * Footnotes: classic, bottom of post

  • † Sidenotes: easy reference, with wider windows

  • ‡ Popover: tap to preview, great on mobile

Here's what they look like:

And some examples of footnotes in action:

Examples
Leaflet posts with footnotes!

Examples

Leaflet posts with footnotes!

Disaster preparedness in Japan: Apps, websites, etc. - aiueo
For English speakers living or traveling in Japan (and other languages, to a more limited extent)
https://aiueo-en.leaflet.pub/3mggw6ypzqk2m
A better Signal wishlist - re:center
Dreams of a better end-to-end-encrypted messaging app.
https://peripheral.leaflet.pub/3mgjezis5fk2y
"the day of spring, warmth, flowers and gentleness" - the diary of a half-asleep owl
how International Women's Day is viewed in my country, and how the government continues to promote this point of view
https://thelittleoutsider.leaflet.pub/3mgl4sfhcdk2b
if i may be a little obsessive… - ren’s letter
omfg. this music.
https://rensletter.leaflet.pub/3mgqhjsgfjk2h
Bots Among Us - 7hird Thoughts
How can we build trust in an era of bots and lies?
https://7hird.dev/3mgzlboei5k2i
A blog intro and a hello world! - A melly band of essayists
If you haven't yet, you should start your own blog!
https://melly.leaflet.pub/3mh35ggyjyk27

We can't wait to see how you use both these new features!

Subscribe to Leaflet Lab Notes
to get updates in Reader, RSS, or via Bluesky Feed
New and improved Leaflet Reader