Manipulating a variable font with mobile motion sensors

03 2021

Mobile motion sensors can control many things on a web page, an exciting possibility is using this with variable fonts.

See this in action here:

A Google variable font - Recursive - is manipulated with mobile phone tilt and compass. There's a bit of code to ask for access on iOS.

p5js used to access mobile phone tilt and compass values. p5 isn't really needed here, but its useful and a great tool for sharing/educating. See the sketch here: and a simpler version here:

The Google varible font properties info is here: The Recursive font is here Some great variable font info here: