Back to Lab
Variable FontsCSSCanvas

Variable Font Playground

Interactive experiments with variable fonts, exploring the design space between weight, width, and custom axes.

What’s This?

Variable fonts are fascinating—they contain an entire family of styles in a single file, with infinite variations between named instances.

This playground lets you explore:

  • Standard axes (weight, width, slant)
  • Custom axes unique to specific typefaces
  • Animation and responsive typography
  • Performance implications

Favorite Discoveries

The most interesting finding was how variable fonts can respond to viewport size, creating truly fluid typography that doesn’t just scale but actually adjusts its design.