Back to Plugins
Figlet

Figlet

Play with the Figma developer platform, follow interactive tutorials and share code examples

learningplugin developmentfigma apideveloperdebugcode-generators

Plugin Preview

Figlet preview

About this plugin

Figlet is a sandbox-like environment with a built-in editor that allows you to play with and learn how to use the Figma developer platform right inside Figma.


Important: This plugin requires you to create a Figlet account so it can save your data and preferences to the cloud.


Features


  1. Create figlets: small code examples using the Figma developer APIs
  2. Play with Figma APIs inside an editor (see limitations below)
  3. Follow interactive tutorials that teach you about the developer platform
  4. Browse community published figlets and publish your own
  5. Star your favourite figlets so you can check them out later


Editor


You can play with the Figma developer platform and its APIs using Figlet's editor. When you create a new figlet you're shown an editor and a new "code.js" file is created.


Running code

To run code, press the "play" icon in the bottom right-hand corner of the plugin window, or press Cmd/Ctrl + Enter.


To improve the editor experience, the editor positions the viewport on the newly created nodes. When you re-run your code, these nodes are removed from the canvas. This wouldn't happen in the real world. You can disable these in the settings section.


Showing a UI window

You can show a UI window by adding a UI file to your figlet and calling it using figma.showUI(__html__) inside the "code.js" file. To add a UI file, click on the dropdown with the folder icon above the editor, and select "ui.html +".


Profile


When you publish your figlets to the community, your name appears next to your figlet. You can set your name in the settings section.


Settings


Editor

  1. Center viewport on run: Viewport is centered on any nodes created by the code
  2. Remove nodes on re-run: Any nodes created are removed before the code is run again
  3. Show toolbar in UI window: A toolbar is shown in the UI window when figma.showUI() is used


Plugin

  1. Remember window state: Remember the last page that was open when closing and re-opening the plugin



Limitations


Because of the nature of Figlet being a plugin, there are some limitations that restrict you from using certain features. These include but may not be limited to:


  1. figma.widget
  2. figma.fileKey
  3. figma.parameters
  4. figma.codegen
  5. figma.teamLibrary (not available yet)
  6. figma.payments (disabled for now)
  7. figma.textreview, figma.on('textreview'...) (disabled for now)


These limitations however do not prevent you from writing and sharing code that contains these methods.


Privacy Policy


When you create a Figlet account, some of your personal information is collected for the purpose of using the plugin. An account is needed so that your data can be backed up and you can share your content with the community.


Only your email address, full name, your avatar and any figlets you create are collected. Your data is never shared with anyone else and is only used for the purpose of managing your account and sharing figlets with other Figlet users.


Your data is stored for as long you have a Figlet account.

Plugin Details

Version58
CreatedMarch 9, 2023
Last UpdatedFebruary 10, 2025
CategorySoftware development
CreatorGavin McFarland
Stats405 installs, 154 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:main.js
  • Network Access:

    The plugin requires network access so users can access domains during development. It connects to Supabase for data storage and Figma for retrieving user avatars.

  • Editor Types:
    figma
  • Allowed Domains:
    • *
    • http://localhost:3748Dev
    • ws://localhost:9001Dev