Figma Developers

Figma Developers

  • Introduction
  • API Reference
  • Updates

›Figma APIs

Figma APIs

  • API Overview
  • The Typings File
  • figma
  • figma.ui
  • figma.viewport
  • figma.clientStorage
  • API errors

Node APIs

  • Node Types
  • BooleanOperationNode
  • ComponentNode
  • ComponentSetNode
  • DocumentNode
  • EllipseNode
  • FrameNode
  • GroupNode
  • InstanceNode
  • LineNode
  • PageNode
  • PolygonNode
  • RectangleNode
  • SliceNode
  • StarNode
  • TextNode
  • VectorNode

Datatypes

  • Action
  • ArcData
  • BlendMode
  • Constraints
  • Effect
  • ExportSettings
  • FontName
  • Guide
  • HandleMirroring
  • Image
  • LayoutGrid
  • LetterSpacing
  • LineHeight
  • OverflowDirection
  • Overlay
  • Paint
  • PublishStatus
  • Reaction
  • Rect
  • RGB/RGBA
  • StrokeCap
  • StrokeJoin
  • TextCase
  • TextDecoration
  • Transition
  • Transform
  • Trigger
  • Vector
  • VectorPath
  • VectorNetwork
  • BaseStyle
  • EffectStyle
  • GridStyle
  • PaintStyle
  • TextStyle

Properties

  • description
  • description
  • findAll
  • findChild
  • findChildren
  • findOne
  • constraint
  • svgOutlineText
  • scaleFactor
  • guides
  • selectedTextRange
  • selection
  • autoRename
  • characters
  • deleteCharacters
  • insertCharacters
  • textAutoResize
  • data
  • windingRule
  • closePlugin
  • combineAsVariants
  • createBooleanOperation
  • createComponent
  • createEllipse
  • createFrame
  • createImage
  • createLine
  • createPage
  • createPolygon
  • createRectangle
  • createSlice
  • createStar
  • createText
  • createVector
  • flatten
  • group
  • loadFontAsync
  • mixed
  • notify
  • off
  • on
  • showUI
  • on
  • onmessage
  • postMessage
  • zoom
  • appendChild
  • children
  • constraints
  • cornerRadius
  • cornerSmoothing
  • counterAxisAlignItems
  • counterAxisSizingMode
  • exportAsync
  • fills
  • fillStyleId
  • findAll
  • findChild
  • findChildren
  • findOne
  • id
  • insertChild
  • layoutAlign
  • layoutGrow
  • layoutMode
  • locked
  • name
  • numberOfFixedChildren
  • overflowDirection
  • parent
  • primaryAxisAlignItems
  • primaryAxisSizingMode
  • relativeTransform
  • remove
  • removed
  • rescale
  • resize
  • resizeWithoutConstraints
  • rotation
  • setPluginData
  • setRelaunchData
  • setSharedPluginData
  • strokeAlign
  • strokeCap
  • strokeJoin
  • toString
  • visible
  • x
  • y

API Overview

figma

Most of the plugin API is accessible from this single global object. This includes functions to create nodes, access the current selection, open a modal, and much more.

Example:

figma.createRectangle()
figma.closePlugin()

Tip: in addition to being available in your plugin, we have also added this global object to every Figma editor window. This means you can open up the developer console in any Figma editor window and use the figma API directly just as you would any other browser API by typing in a line of code and pressing enter. You don’t have to write a plugin at all to do this. This is a really powerful way to experience the API for yourself in an interactive environment as well as debug issues with using the Figma plugin API.

__html__

If you assigned a file name to the "ui" field in your manifest.json file, the contents of that file will be accessible through this variable within your plugin code. This lets you call figma.showUI(__html__) instead of having inline HTML in a JavaScript string. The benefit is that your text editor will render the HTML with syntax highlighting since it’s in a separate file.

__uiFiles__

Alternatively, if you assigned a map to the "ui" field in your manifest.json file:

"ui": {
  "main": "main.html",
  "secondary": "secondary.html"
}

The contents of each file in the map will be accessible through this global variable within your plugin code. You'll then be able to call figma.showUI(__uiFiles__.main).

The Typings File →
Learn more about Figma