Figma recently introduced typography variables during their framework event. These variables are exported accurately in the JSON, which is great. However, it's still necessary to use styles as they support additional type settings such as textCase and textDecoration, and act as a helpful container for multiple variables associated with a particular text style.
It's important to use the new typography variables in styles without resolving the aliases, so that variable modes can have an impact on styles. For instance, if font size variables are created with Desktop and Mobile modes, styles should reference those variables. This way, if a specific mode is selected, the style will adjust accordingly.
Current available typography variables are:
Font family
Font weight and style
Font size
Line height
Letter spacing
Paragraph spacing
Paragraph Indent
Styles tokens should then be expanded to support paragraphSpacing and paragraphIndent as part of this enhancement.
Something to note: It appears to me that fontWeight parameter in the typography styles tokens is always a number, figma however supports both string or number variables, and I guess that string variables are needed to apply "Italic" style (pls correct me if I am wrong). Therefore I believe that our typography style "fontWeight" should correctly support alias variables both as numbers or strings.
EDITED: added Paragraph Indent and Font Style after checking the proper Figma release notes
Figma recently introduced typography variables during their framework event. These variables are exported accurately in the JSON, which is great. However, it's still necessary to use styles as they support additional type settings such as textCase and textDecoration, and act as a helpful container for multiple variables associated with a particular text style.
It's important to use the new typography variables in styles without resolving the aliases, so that variable modes can have an impact on styles. For instance, if font size variables are created with Desktop and Mobile modes, styles should reference those variables. This way, if a specific mode is selected, the style will adjust accordingly.
Current available typography variables are: Font family Font weight and style Font size Line height Letter spacing Paragraph spacing Paragraph Indent
Styles tokens should then be expanded to support paragraphSpacing and paragraphIndent as part of this enhancement. Something to note: It appears to me that fontWeight parameter in the typography styles tokens is always a number, figma however supports both string or number variables, and I guess that string variables are needed to apply "Italic" style (pls correct me if I am wrong). Therefore I believe that our typography style "fontWeight" should correctly support alias variables both as numbers or strings.
EDITED: added Paragraph Indent and Font Style after checking the proper Figma release notes