Figma Developers

Figma Developers

  • Introduction
  • API Reference
  • Updates

›Node 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
  • commitUndo
  • 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

SliceNode

A slice is an invisible object with a bounding box, represented as dashed lines in the editor. Its purpose is to allow you to export a specific part of a document. Generally, the only thing you will do with a slice is to add an exportSettings and export its content via exportAsync.

Slice properties

type: "SLICE" [readonly]

The type of this node, represented by the string literal "SLICE"

clone(): SliceNode

Duplicates the slice node. By default, the duplicate will be parented under figma.currentPage.

Base node properties

id: string [readonly]

An internal identifier for a node. Plugins typically don't need to use this since you can usually just access a node directly. [Read more]

parent: (BaseNode & ChildrenMixin) | null [readonly]

Returns the parent of this node, if any. This property is not meant to be directly edited. To reparent, see appendChild. [Read more]

removed: boolean [readonly]

Returns true if this node has been removed since it was first accessed. If your plugin stays open for a while and stores references to nodes, you should write your code defensively and check that the nodes haven't been removed by the user. [Read more]

name: string

The name of the layer that appears in the layers panel. This may update automatically for text layers. Returns the name of the current file on figma.root (read-only). [Read more]

toString(): string

Returns a string representation of the node. For debugging purposes only, do not rely on the exact output of this string in production code. [Read more]

remove(): void

Removes this node and all of its children from the document. [Read more]

getPluginData(key: string): string

Retrieves custom information that was stored on this node using setPluginData.

setPluginData(key: string, value: string): void

Lets you store custom information on any node, private to your plugin. [Read more]

getSharedPluginData(namespace: string, key: string): string

Retrieves custom information that was stored on this node using setSharedPluginData.

setSharedPluginData(namespace: string, key: string, value: string): void

Lets you store custom information on any node, public to all plugins. [Read more]

setRelaunchData(relaunchData: RelaunchData): void

Sets state on the node to show a button and description in the properties panel when the node is selected. Clears the button and description when relaunchData is {}. [Read more]

RelaunchData = { [command: string]: /* description */ string }
e.g. relaunchData = { myCommand: 'Short description' }

Scene node properties

visible: boolean

Whether the node is visible or not. Does not affect a plugin's ability to access the node. [Read more]

locked: boolean

Whether the node is locked or not, preventing certain user interactions on the canvas such as selecting and dragging. Does not affect a plugin's ability to write to those properties. [Read more]

Layout-related properties

absoluteTransform: Transform [readonly]

The position of a node relative to its containing page as a Transform matrix.

relativeTransform: Transform

The position of a node relative to its containing parent as a Transform matrix. Not used for scaling, see width and height instead. Read the details page to understand the nuances of this property. [Read more]

x: number

The position of the node. Identical to relativeTransform[0][2]. [Read more]

y: number

The position of the node. Identical to relativeTransform[1][2]. [Read more]

rotation: number

The rotation of the node in degrees. Returns values from -180 to 180. Identical to Math.atan2(-m10, m00) in the relativeTransform matrix. When setting rotation, it will also set m00, m01, m10, m11. [Read more]

width: number [readonly]

The width of the node. Use a resizing method to change this value.

height: number [readonly]

The height of the node. Use a resizing method to change this value.

constrainProportions: boolean [readonly]

When toggled, causes the layer to keep its proportions when the user resizes it via the properties panel.

layoutAlign: "STRETCH" | "INHERIT"

Applicable only on direct children of auto-layout frames, ignored otherwise. Determines if the layer should stretch along the parent’s counter axis. Defaults to “INHERIT”. [Read more]

layoutGrow: number

This property is applicable only for direct children of auto-layout frames, ignored otherwise. Determines whether a layer should stretch along the parent’s primary axis. 0 corresponds to a fixed size and 1 corresponds to stretch. [Read more]

resize(width: number, height: number): void

Resizes the node. If the node contains children with constraints, it applies those constraints during resizing. If the parent has auto-layout, causes the parent to be resized. [Read more]

resizeWithoutConstraints(width: number, height: number): void

Resizes the node. Children of the node are never resized, even if those children have constraints. If the parent has auto-layout, causes the parent to be resized (this constraint cannot be ignored). [Read more]

rescale(scale: number): void

Rescales the node. This API function is the equivalent of using the Scale Tool from the toolbar. [Read more]

Export-related properties

exportSettings: ReadonlyArray<ExportSettings>

List of export settings stored on the node. For help on how to change this value, see Editing Properties.

exportAsync(settings?: ExportSettings): Promise<Uint8Array>

Exports the node as an encoded image. [Read more]

← RectangleNodeStarNode →
  • Slice properties
  • Base node properties
  • Scene node properties
  • Layout-related properties
  • Export-related properties
Learn more about Figma