Skip to content

Figma plugin to support COLRv1 fonts including variable

Notifications You must be signed in to change notification settings

Lorp/figma-colrv1

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

66 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

figma-colrv1

Figma plugin to support COLRv1 fonts including Noto Color Emoji and variable fonts.

Fonts

Emoji fonts

Two emoji fonts are embedded in the plugin. Emoji fonts are large, so embedding helps avoid loading delays.

Text fonts

Several color text fonts are included, as URLs to fonts hosted online. These fonts are small, so loading delays are minimal.

Installation

  1. Download and unzip this repo.
  2. Download and open Figma Desktop app.
  3. In Figma, either:
  • Click the Resources button, click the Plugins tab, then the + button. Click “Import plugin from manifest…” then select the manifest.json file from the repo.
  • From the main “F” menu, select Plugins, Development, “Import plugin from manifest…” then select the manifest.json file from the repo.

Invoking the plugin

Click the Resources button, then click the Run button by the “figma-colrv1” plugin.

Usage

You have two tabs: Emoji and Text. For text fonts, you can edit the palettes of each font.

Notes

The plugin uses the Samsa library, version 2, to decode the COLRv1 font data and render the glyphs as SVG. Samsa Version 2 can be tried in the browser using RenderStack.

Development

Be familiar with Figma: Plugin Quickstart Guide.

This plugin uses TypeScript and NPM, two standard tools in creating JavaScript applications.

  1. Open the project folder in Visual Studio Code.

  2. npm install to install the dependencies.

  3. Compile TypeScript to JavaScript: Run the "Terminal > Run Build Task..." menu item, then select "npm: watch". You will have to do this again every time you reopen Visual Studio Code.

About

Figma plugin to support COLRv1 fonts including variable

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published