logo
Resources
Table of content
Motiff AI
Interface
Layers and tools
Layer properties
Design systems
Prototypes
Dev Mode
Collaboration
Import and export
File settings
Account
File management
Team management
Sharing and permissions
Billing
Organization
Apps
Work with support
Help Center/Layer properties/Text properties/Variable fonts

Variable fonts

A variable font is a font file that includes a continuous series of design variants. An entire typeface can be stored in the file, offering an unlimited selection of fonts to choose from. Font properties (such as weight, width, slant, etc.) can be continuously adjusted within a preset range without being limited to fixed font styles.

You can customize font properties by adjusting the variable font axes.

Tip: You can find resources about the variable font through Google Fonts, V-fonts, etc.

Use variable fonts

Customize properties of variable fonts

  1. 1.

    Select the text layer using the variable font.

  2. 2.

    You can open the Variable font axes… panel in two ways:

    • Click '16_Panel_More (2).svg' in the lower right corner of the Text module in the right sidebar to switch to Variable font axes…. '29 (4).png'
    • Navigate to the Text module, click '16_Common_ArrowDown.svg' and open the drop-down menu for weight adjustment, and select Variable font axes….
  3. 3.

    Drag the slider or enter specific values to adjust the property values of each axis. '42 (3).png'

Apply variable fonts easily

Motiff will automatically record the variable fonts you set for easy application to text layers.

  1. 1.

    Select one or more text layers using the variable font.

  2. 2.

    Click '16_Common_ArrowDown.svg' and open the drop-down menu in the Text module for weight adjustment. '35 (4) (1).png'

  3. 3.

    Choose from variable font styles.

    '63.png'

FAQ

  1. 1.

    The team's shared fonts currently use static fonts. How to replace them with variable fonts? The shared font feature for teams is limited to Organization plan users. Admins can directly upload variable font files. For more information, see Upload shared fonts to an organization. Motiff will prompt you on whether to replace the existing static fonts. After confirmation, the variable fonts will replace the original static fonts.

  2. 2.

    I have already installed variable fonts locally, why are they unavailable in Motiff? To use local variable fonts, you need to make sure that the Motiff Font Agent or desktop app is the latest version. Motiff requires the following versions for the font agent:

    • Motiff Font Agent 2.0.0 or higher.
    • Desktop app 1.1.5 or higher.

    You can download the desktop app or Motiff Font Agent from motiff.com.

  3. 3.

    How can developers view variable font properties during the handoff process? If you have Can view access to a file, you can view the variable font properties in the Properties panel in the right sidebar.

    If you are accessing the file in Dev Mode, you can view the variable font properties and copy the corresponding code in the Inspect panel in the right sidebar.