Skip to main content
Sanctuary Computer

Figma Typography

Web and social design for Figma to announce the launch of the product’s new variable fonts feature.
Cover graphic: the letters ‘Ra’ in Figma blue with a weight slider underneath set at 400, animating between font weights.

Brief

Create a minisite and social assets that announce the launch of Figma's new Variable Fonts integration.

Solution

The project needed to do four things: explain what variable fonts are, show why they matter to product designers, demonstrate examples in use, and preview how they work inside the Figma interface.

With the help of the Figma team and a bit of research, we dove into a few ways to visually explain the concepts of variable fonts that relate to product designers (such as grade and optical sizing) and worked them into a website design through motion and interaction.

Preview of the variable fonts feature within the Figma app vs. our abstracted design