Variable Fonts
<h2>Variable fonts, now in Figma!</h2><p><br></p><p>A plugin to provide basic variable fonts support through <a href="https://github.com/Lorp/samsa" rel="noreferrer noopener nofollow" target="_blank">samsa.js</a>.</p><h2><br></h2><p>This plugin enables you to:</p><ul><li>Render variable fonts as graphics on the Figma canvas</li><li>Preview, create, and edit/update these graphics</li><li>Choose from all the axes in a variable font</li><li>Choose from all the variable fonts available from Google Fonts</li></ul><p><br></p><h2>Usage</h2><p><br></p><p>You should see the Variable Fonts palette appear, similar to the screenshot above.</p><p><br></p><ul><li>Pick one of the dozens of variable fonts available from <a href="https://fonts.google.com/?vfonly=true" rel="noreferrer noopener nofollow" target="_blank">Google Fonts</a>.</li><li>In the Preview section, enter some custom text.</li><li>Set the color and axes values you want.</li><li>Then click the Add button at the top of the Preview section.</li></ul><p><br></p><p>This will add a Vector graphic object to your Figma canvas.</p><p><br></p><p>That result is a normal Figma Vector object that you can do all the normal things you can typically do with such objects.</p><p><br></p><p>It is <strong>NOT</strong> a Text object!</p><p><br></p><p>Do you have a bug, feature request, or improvement? Submit a PR or file an issue here: <a href="https://github.com/Tgemayel/variable-fonts-figma/issues" rel="noreferrer noopener nofollow" target="_blank">https://github.com/Tgemayel/variable-fonts-figma/issues</a></p>
Plugin Preview
About this plugin
Variable fonts, now in Figma!
A plugin to provide basic variable fonts support through samsa.js.
This plugin enables you to:
- Render variable fonts as graphics on the Figma canvas
- Preview, create, and edit/update these graphics
- Choose from all the axes in a variable font
- Choose from all the variable fonts available from Google Fonts
Usage
You should see the Variable Fonts palette appear, similar to the screenshot above.
- Pick one of the dozens of variable fonts available from Google Fonts.
- In the Preview section, enter some custom text.
- Set the color and axes values you want.
- Then click the Add button at the top of the Preview section.
This will add a Vector graphic object to your Figma canvas.
That result is a normal Figma Vector object that you can do all the normal things you can typically do with such objects.
It is NOT a Text object!
Do you have a bug, feature request, or improvement? Submit a PR or file an issue here: https://github.com/Tgemayel/variable-fonts-figma/issues
Plugin Details
Version | 2 |
---|---|
Created | April 20, 2021 |
Last Updated | May 26, 2021 |
Category | fonts-typography |
Creator | Toni Gemayel |
Stats | 9087 installs, 193 likes |
Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/ui.html
- main:dist/code.js
More Like This
Discover other plugins in the fonts-typography category.