📝 This Week in Web Design and Development

To kick things off this week, here’s a beautiful website all about a new typeface for coding called Recursive Sans and Mono. The nifty thing about this typeface is that it’s also a rather intricately made variable font, which means that it has a ton of customizable options to best suit our needs.

So effectively this is actually two separate typefaces in one font file. That means you can animate between the two easily if needs be! In the type specimen website there’s a great example of how to switch between these different options, or “axes”, with the CSS font-variation-settings property:

What does this mean? Well, it means we have all this control now that was previously impossible, we can maybe have more performant sites since we don’t need to download multiple resources, and we can animate text like so:

The example on the left is of a regular spaced font that’s switching between regular and bold, but the example on the right shows how since Recursive is a monospaced variable font there’s no need for that jarrring text jump. Interesting stuff!