Tilt is a family of type inspired by the dimensional lettering found in storefront signage. It’s comprised of three related variable font styles that you might find in a shop window — Tilt Neon, Tilt Prism, and Tilt Warp.

All three are based around the same letter model of a sign painter’s geometric sans serif, similar to the typefaces Futura or Avant Garde, but with the kinds of details you might expect to see when the letter is built up with a brush.

The three styles are designed and built as variable fonts. They allow users to rotate the orientation of their glyphs with “Rotation in X” and “Rotation in Y” axes. The rotation is limited to ±45° so that the letterforms never rotate past a readable range.

To contribute, see github.com/googlefonts/Tilt-Fonts.

The most common axes used in variable fonts are Italic, Optical Size, Slant, Weight, and Width. And while you can sometimes get creative at the extremes of these axes, they're more often used to finesse type. For example, with Weight, you don't have to settle on what the type designer designated as the Bold style, you can tweak it to be a bit lighter or heavier so it's perfect for you.

Variable fonts also open up many possibilities for creative expression! And Google Fonts is adding a bunch of fonts to your palette with new axes to get your juices flowing.

First up are the Tilt fonts by Andy Clymer, Tilt Neon, Tilt Prism, and Tilt Warp:

Initially sparked by the experience of seeing a neon sign from the side, Clymer was inspired to create fonts that allow the orientation of their glyphs to be rotated horizontally and vertically. "With variable fonts, I thought it was kind of amazing how the physical form of a common sans-serif could inadvertently blend into something that looked like graffiti lettering," says Clymer.

All three fonts are takes on dimensional storefront signage and are controlled by Rotation in X (HROT), and Rotation in Y (VROT) variable axes. The rotation is limited to ±45° so that the letterforms are always within a readable range.

To learn more, visit: