Skip to content

marcomontalbano/figma-plugin-run-github-actions-workflows

Repository files navigation

Figma Plugin - Run GitHub Actions workflows

Run GitHub Actions workflows directly within Figma, using the selected page and nodes as inputs.

Demo

Usage

Begin by creating a GitHub Actions workflow.

Configure your workflow to run on workflow_dispatch event:

on: 
  workflow_dispatch:
    inputs:
      fileKey:
        description: Figma file key
        type: string
        required: true
      page:
        description: Stringified selected page (id, name)
        type: string
        default: '{}'
        required: true
      selection:
        description: Stringified array of the selected nodes (id, name)
        type: string
        default: '[]'
        required: true

As previously mentioned, the plugin triggers the workflow sending the fileKey, the selected page, and the list of selected nodes as selection.

You can then configure the workflow according to your needs. To get started, you can use this example from-figma.yaml.

Tip

You can manipulate the received inputs as needed. Refer to this working example.

Figma

Setting up in Figma is simple. Just run this plugin.

Enter the fileKey:

Plugin homepage

and setup a new workflow by clicking the + button (you'll also need a GitHub access token):

Plugin add workflow

Finally, select a page and one or more nodes, and then click . This will run the selected workflow, passing your selection as workflow inputs.

Triggered GitHub Actions workflow

Figma Export PDFs

What do you think about exporting Figma content as PDF document to an FTP Server, just by clicking a button within Figma? Would it be cool, isn't it?

Check out this workflow and discover how it's entirely feasible. Simply clone the workflow and setup this Figma plugin 😉.