Easily switch between multiple fonts in your designs with a free plugin.

Syntaxer adds syntax highlighting to your code samples in Figma. It preserves your preferences and supports 175 languages and 28 themes.

Speaking of new typefaces, I’ve been enjoying a highly versatile Innovator Grotesk lately. Unlike some of the traditional typefaces from the print era, this one is made with UI design in mind — its well-balanced vertical metrics make it a breeze to center text vertically inside elements or next to icons. It works well as a drop-in replacement for Inter or San Francisco, and I like a slightly wider width and less ubiquitous look. Highly recommend checking out its beautiful specimens and a simple license.

In the first article in the series on Figma’s brand evolution, editor Jenny Xie takes us behind the scenes of the new custom typeface, Figma Sans, designed by Swiss and American type foundry Grilli Type. Don’t miss the Figma Sans page on the foundry’s website.

Figma just added 450 new Google Fonts to the app. Select ​“Google Fonts (8÷24 update)” from the font picker dropdown to access them.

Brilliant tip from Molly Hellmuth — create a special text style for labels where line height aligns to your grid. No matter what variable is used for padding, the height of your UI elements will be a multiple of the base grid. (This is also a nice way to keep your labels aligned with icons.)

My friend Helena Zhang designed a new monospaced pixel font and licensed it under the SIL Open Font License. It’s beautiful and nostalgic, bringing back so many memories from the early days of the web. The website is a lovely mix of retro vibes and a modern feel.

Miggi explains how to control the behavior of text fields with visual and keyboard shortcuts without touching the auto width/​height or fixed size controls in the Design panel.

Luis on the power of efficient aliasing when building typographic styles from primitives.

Day 3: Add template text styles in the Design mode instead of jumping between modes.

A quick tip from Miggi on using grids to generate type scale and place graphics.

Roughly 20% of the population has dyslexia. The Letter Checker by Stark helps you pick fonts that are more likely to work for those people.

The official Grammarly plugin: ​“Create impactful, mistake-free content faster with your trusted AI writing partner available directly in Figma. Grammarly helps teams meet their goals while staying on-brand and in compliance.”

Daniel Destefanis from Figma made a plugin that shows how text layers within a selection are styled (or unstyled). This plugin complements the existing native Figma feature Selection colors and is a great way to see what layers aren’t using styles or select layers by font. Read more in Daniel’s Twitter thread.

Whoa, finally! Can’t believe this is getting fixed a few days before Config. Add bold, italic, underline, or strikethrough font style to a portion of text with an applied style without detaching it first.

Christine Vallaure made a responsive and modular type scale using a scaling ratio approach.

Typography variables can now be scoped to limit which properties they can be applied to. For example, if you scope a number variable to font size, you can only apply the variable to font size.

Also, copying and pasting an object bound to local variables will no longer populate a file with local variables unless you choose to in a tooltip.

A new video in Luis Ouriach’s ​“My First Variable” series on the typography support within variables. He explains using string and number variables to set font weights, combining weights with styles such as italics, grouping text variables, aliasing font families, naming conventions, and more.

Niki Tonsky claims that ​“we, as a civilization, forgot how to center things.” As always, his essay gets into nitty-gritty design details in the most hilarious way. He explains how CSS, font metrics, and icons get in the way of centering things and what designers and developers can do about them.

Scan local text styles, convert their properties into typographic variables, and bind them back to the text styles. Christine Vallaure recommends this plugin in her recent video and shows how to use it.