figma-js
- Version 1.16.1-0
- Published
- 122 kB
- 1 dependency
- MIT license
Install
npm i figma-js
yarn add figma-js
pnpm add figma-js
Overview
A simple wrapper for the Figma API
Index
Functions
Interfaces
FrameBase
- absoluteBoundingBox
- background
- backgroundColor
- blendMode
- children
- clipsContent
- constraints
- cornerRadius
- counterAxisAlignItems
- counterAxisSizingMode
- effects
- exportSettings
- fills
- horizontalPadding
- isMask
- itemSpacing
- layoutAlign
- layoutGrids
- layoutMode
- opacity
- overflowDirection
- paddingBottom
- paddingLeft
- paddingRight
- paddingTop
- preserveRatio
- primaryAxisAlignItems
- primaryAxisSizingMode
- rectangleCornerRadii
- relativeTransform
- size
- strokeAlign
- strokes
- strokeWeight
- transitionDuration
- transitionEasing
- transitionNodeID
- verticalPadding
Type Aliases
Functions
function Client
Client: (opts: ClientOptions) => ClientInterface;
Interfaces
interface BooleanOperation
interface BooleanOperation extends VectorBase {}
A group that has a boolean operation applied to it
property booleanOperation
readonly booleanOperation: 'UNION' | 'INTERSECT' | 'SUBTRACT' | 'EXCLUDE';
A string enum with value of "UNION", "INTERSECT", "SUBTRACT", or "EXCLUDE" indicating the type of boolean operation applied
property children
readonly children: ReadonlyArray<Node>;
An array of nodes that are being boolean operated on
property type
readonly type: 'BOOLEAN_OPERATION';
interface Canvas
interface Canvas extends Global {}
Represents a single page
property backgroundColor
readonly backgroundColor: Color;
Background color of the canvas
property children
readonly children: ReadonlyArray<Node>;
An array of top level layers on the canvas
property exportSettings
readonly exportSettings?: ReadonlyArray<ExportSetting>;
An array of export settings representing images to export from the canvas
property prototypeStartNodeID
readonly prototypeStartNodeID: string | null;
Node ID that corresponds to the start frame for prototypes
property type
readonly type: 'CANVAS';
interface ClientInterface
interface ClientInterface {}
property client
readonly client: AxiosInstance;
property comments
readonly comments: (fileId: string) => AxiosPromise<Figma.CommentsResponse>;
A list of comments left on the file
Parameter String
File to get comments from
See Also
https://www.figma.com/developers/api#get-comments-endpoint
property component
readonly component: (key: string) => AxiosPromise<Figma.ComponentResponse>;
Get metadata on a component by key.
Parameter The
unique identifier of the component.
See Also
https://www.figma.com/developers/api#get-component-endpoint
property componentSet
readonly componentSet: (key: string) => AxiosPromise<Figma.ComponentSetResponse>;
Get metadata on a component set by key.
Parameter The
unique identifier of the component.
See Also
https://www.figma.com/developers/api#get-component-sets-endpoint
property deleteComment
readonly deleteComment: ( fileId: string, commentId: string) => AxiosPromise<Figma.Comment>;
Delete a comment from the file
Parameter String
File to delete comment from
Parameter String
id of the comment to be deleted
See Also
https://www.figma.com/developers/api#delete-comments-endpoint
property file
readonly file: ( fileId: string, params?: FileParams) => AxiosPromise<Figma.FileResponse>;
Returns the document refered to by :key as a JSON object. The file key can be parsed from any Figma file url: https://www.figma.com/file/:key/:title. The "document" attribute contains a Node of type DOCUMENT.
Parameter String
File to export JSON from
See Also
https://www.figma.com/developers/api#get-files-endpoint
property fileComponents
readonly fileComponents: ( fileId: string) => AxiosPromise<Figma.FileComponentsResponse>;
Get a list of published components within a file
Parameter String
Id of the file to list components from
See Also
https://www.figma.com/developers/api#get-file-components-endpoint
property fileComponentSets
readonly fileComponentSets: ( fileId: string) => AxiosPromise<Figma.FileComponentSetsResponse>;
Get a list of published component sets within a file
Parameter String
Id of the file to list components from
See Also
https://www.figma.com/developers/api#get-team-component-sets-endpoint
property fileImageFills
readonly fileImageFills: ( fileId: string) => AxiosPromise<Figma.FileImageFillsResponse>;
Returns download links for all images present in image fills in a document. Image fills are how Figma represents any user supplied images. When you drag an image into Figma, we create a rectangle with a single fill that represents the image, and the user is able to transform the rectangle (and properties on the fill) as they wish.
This endpoint returns a mapping from image references to the URLs at which the images may be download. Image URLs will expire after no more than 14 days. Image references are located in the output of the GET files endpoint under the imageRef attribute in a Paint.
Parameter String
File to export images from
See Also
https://www.figma.com/developers/api#get-image-fills-endpoint
property fileImages
readonly fileImages: ( fileId: string, params: FileImageParams) => AxiosPromise<Figma.FileImageResponse>;
If no error occurs, "images" will be populated with a map from node IDs to URLs of the rendered images, and "status" will be omitted. Important: the image map may contain values that are null. This indicates that rendering of that specific node has failed. This may be due to the node id not existing, or other reasons such has the node having no renderable components. It is guaranteed that any node that was requested for rendering will be represented in this map whether or not the render succeeded.
Parameter String
File to export images from
Parameter FileImageParams
See Also
https://www.figma.com/developers/api#get-images-endpoint
property fileNodes
readonly fileNodes: ( fileId: string, params: FileNodesParams) => AxiosPromise<Figma.FileNodesResponse>;
Returns the nodes referenced to by :ids as a JSON object. The nodes are retrieved from the Figma file referenced to by :key. The node Id and file key can be parsed from any Figma node url: https://www.figma.com/file/:key/:title?node-id=:id.
Parameter String
File to export JSON from
Parameter FileNodesParams
See Also
https://www.figma.com/developers/api#get-file-nodes-endpoint
property fileStyles
readonly fileStyles: (fileId: string) => AxiosPromise<Figma.FileStylesResponse>;
Get a list of published styles within a file
Parameter String
Id of the file to list styles from
See Also
https://www.figma.com/developers/api#get-file-styles-endpoint
property fileVersions
readonly fileVersions: ( fileId: string) => AxiosPromise<Figma.FileVersionsResponse>;
Returns a list of the versions of a file. The file key can be parsed from any Figma node url: https://www.figma.com/file/:key/:title.
Parameter String
File to get version history from
See Also
https://www.figma.com/developers/api#get-file-versions-endpoint
property me
readonly me: () => AxiosPromise< Figma.User & { readonly email: string; }>;
Get user information for the authenticated user.
See Also
https://www.figma.com/developers/api#get-me-endpoint
property postComment
readonly postComment: ( fileId: string, params: PostCommentParams) => AxiosPromise<Figma.Comment>;
Posts a new comment on the file.
Parameter String
File to post comment to
Parameter PostCommentParams
See Also
https://www.figma.com/developers/api#post-comments-endpoint
property projectFiles
readonly projectFiles: ( projectId: string) => AxiosPromise<Figma.ProjectFilesResponse>;
List the files in a given project.
Parameter String
Id of the project to list files from
See Also
https://www.figma.com/developers/api#get-project-files-endpoint
property style
readonly style: (key: string) => AxiosPromise<Figma.StyleResponse>;
Get metadata on a style by key.
Parameter The
unique identifier of the style.
See Also
https://www.figma.com/developers/api#get-style-endpoint
property teamComponents
readonly teamComponents: ( teamId: string, params?: PaginationParams) => AxiosPromise<Figma.TeamComponentsResponse>;
Get a paginated list of published components within a team library
Parameter String
Id of the team to list components from
See Also
https://www.figma.com/developers/api#get-team-components-endpoint
property teamComponentSets
readonly teamComponentSets: ( teamId: string, params?: PaginationParams) => AxiosPromise<Figma.TeamComponentSetsResponse>;
Get a paginated list of published component sets within a team library
Parameter String
Id of the team to list components from
See Also
https://www.figma.com/developers/api#get-team-component-sets-endpoint
property teamProjects
readonly teamProjects: ( teamId: string) => AxiosPromise<Figma.TeamProjectsResponse>;
Lists the projects for a specified team. Note that this will only return projects visible to the authenticated user or owner of the developer token.
Parameter String
Id of the team to list projects from
See Also
https://www.figma.com/developers/api#get-team-projects-endpoint
property teamStyles
readonly teamStyles: ( teamId: string, params?: PaginationParams) => AxiosPromise<Figma.TeamStylesResponse>;
Get a paginated list of published styles within a team library
Parameter String
Id of the team to list styles from
See Also
https://www.figma.com/developers/api#get-team-styles-endpoint
interface ClientOptions
interface ClientOptions {}
property accessToken
readonly accessToken?: string;
access token returned from OAuth authentication
property apiRoot
readonly apiRoot?: string;
custom API root
property personalAccessToken
readonly personalAccessToken?: string;
personal access token obtained from account settings
interface Color
interface Color {}
An RGBA color
interface ColorStop
interface ColorStop {}
A position color pair representing a gradient stop
interface Comment
interface Comment {}
A comment or reply left by a user
property client_meta
readonly client_meta: Vector2 | FrameOffset;
property created_at
readonly created_at: Date;
The time at which the comment was left
property file_key
readonly file_key: string;
The file in which the comment lives
property id
readonly id: string;
Unique identifier for comment
property message
readonly message: string;
(MISSING IN DOCS) The content of the comment
property order_id
readonly order_id: number;
Only set for top level comments. The number displayed with the comment in the UI
property parent_id
readonly parent_id: string;
If present, the id of the comment to which this is the reply
property resolved_at
readonly resolved_at: Date | null;
If set, when the comment was resolved
property user
readonly user: User;
The user who left the comment
interface CommentsResponse
interface CommentsResponse {}
property comments
readonly comments: ReadonlyArray<Comment>;
interface Component
interface Component extends FrameBase {}
A node that can have instances created of it that share the same properties
property type
readonly type: 'COMPONENT';
interface ComponentMetadata
interface ComponentMetadata {}
A description of a master component. Helps you identify which component instances are attached to
property description
readonly description: string;
The description of the element as entered in the editor
property key
readonly key: string;
The unique identifier of the element
property name
readonly name: string;
The name of the element
interface ComponentResponse
interface ComponentResponse {}
interface ComponentSet
interface ComponentSet extends FrameBase {}
A node that can have multiple component variations
property type
readonly type: 'COMPONENT_SET';
interface ComponentSetResponse
interface ComponentSetResponse {}
interface Constraint
interface Constraint {}
Sizing constraint for exports
property type
readonly type: 'SCALE' | 'WIDTH' | 'HEIGHT';
Type of constraint to apply; string enum with potential values below "SCALE": Scale by value "WIDTH": Scale proportionally and set width to value "HEIGHT": Scale proportionally and set height to value
property value
readonly value: number;
See type property for effect of this field
interface Document
interface Document extends Global {}
The root node
interface Effect
interface Effect {}
A visual effect such as a shadow or blur
property blendMode
readonly blendMode?: BlendMode;
property color
readonly color?: Color;
property offset
readonly offset?: Vector2;
property radius
readonly radius: number;
Radius of the blur effect (applies to shadows as well)
property type
readonly type: 'INNER_SHADOW' | 'DROP_SHADOW' | 'LAYER_BLUR' | 'BACKGROUND_BLUR';
Type of effect as a string enum
property visible
readonly visible: boolean;
Is the effect active?
interface Ellipse
interface Ellipse extends VectorBase {}
An ellipse
property type
readonly type: 'ELLIPSE';
interface ExportSetting
interface ExportSetting {}
Format and size to export an asset at
property constraint
readonly constraint: Constraint;
Constraint that determines sizing of exported asset
property format
readonly format: 'JPG' | 'PNG' | 'SVG' | 'PDF';
Image type, string enum
property suffix
readonly suffix: string;
File suffix to append to all filenames
interface FileComponentSetsResponse
interface FileComponentSetsResponse {}
interface FileComponentsResponse
interface FileComponentsResponse {}
interface FileImageFillsResponse
interface FileImageFillsResponse {}
interface FileImageParams
interface FileImageParams {}
property format
readonly format?: exportFormatOptions;
A string enum for the image output format, can be "jpg", "png", "svg", or "pdf"
property ids
readonly ids: ReadonlyArray<string>;
A list of node IDs to render
property scale
readonly scale?: number;
A number between 0.01 and 4, the image scaling factor
property svg_include_id
readonly svg_include_id?: boolean;
Whether to include id attributes for all SVG elements. false
property svg_simplify_stroke
readonly svg_simplify_stroke?: boolean;
Whether to simplify inside/outside strokes and use stroke attribute if possible instead of . true
property use_absolute_bounds
readonly use_absolute_bounds?: boolean;
Use the full dimensions of the node regardless of whether or not it is cropped or the space around it is empty. Use this to export text nodes without cropping. false
property version
readonly version?: string;
A specific version ID to use. Omitting this will use the current version of the file
interface FileImageResponse
interface FileImageResponse {}
interface FileNodesParams
interface FileNodesParams {}
property geometry
readonly geometry?: string;
Set to "paths" to export vector data
property ids
readonly ids: ReadonlyArray<string>;
A list of node IDs to retrieve and convert
property plugin_data
readonly plugin_data?: string;
A comma separated list of plugin IDs and/or the string "shared". Any data present in the document written by those plugins will be included in the result in the
pluginData
andsharedPluginData
properties.
property version
readonly version?: string;
A specific version ID to get. Omitting this will get the current version of the file
interface FileNodesResponse
interface FileNodesResponse {}
property lastModified
readonly lastModified: string;
property name
readonly name: string;
property nodes
readonly nodes: { readonly [key: string]: null | { readonly document: Node; readonly components: { readonly [key: string]: ComponentMetadata; }; readonly styles: { readonly [key: string]: Style; }; readonly schemaVersion: number; };};
property role
readonly role: RoleType;
property thumbnailUrl
readonly thumbnailUrl: string;
property version
readonly version: string;
interface FileParams
interface FileParams {}
property depth
readonly depth?: number;
Positive integer representing how deep into the document tree to traverse. For example, setting this to 1 returns only Pages, setting it to 2 returns Pages and all top level objects on each page. Not setting this parameter returns all nodes
property geometry
readonly geometry?: string;
Set to "paths" to export vector data
property ids
readonly ids?: ReadonlyArray<string>;
A list of nodes that you care about in the document. If specified, only a subset of the document will be returned corresponding to the nodes listed, their children, and everything between the root node and the listed nodes
property plugin_data
readonly plugin_data?: string;
A comma separated list of plugin IDs and/or the string "shared". Any data present in the document written by those plugins will be included in the result in the
pluginData
andsharedPluginData
properties.
property version
readonly version?: string;
A specific version ID to get. Omitting this will get the current version of the file
interface FileResponse
interface FileResponse {}
property components
readonly components: { readonly [key: string]: ComponentMetadata;};
property document
readonly document: Document;
property lastModified
readonly lastModified: string;
property name
readonly name: string;
property role
readonly role: RoleType;
property schemaVersion
readonly schemaVersion: number;
property styles
readonly styles: { readonly [key: string]: Style;};
property thumbnailUrl
readonly thumbnailUrl: string;
property version
readonly version: string;
interface FileStylesResponse
interface FileStylesResponse {}
interface FileSummary
interface FileSummary {}
property key
readonly key: string;
property last_modified
readonly last_modified: string;
property name
readonly name: string;
property thumbnail_url
readonly thumbnail_url: string;
interface FileVersionsResponse
interface FileVersionsResponse {}
property versions
readonly versions: ReadonlyArray<VersionMetadata>;
interface Frame
interface Frame extends FrameBase {}
A node of fixed size containing other nodes
property type
readonly type: 'FRAME';
interface FrameBase
interface FrameBase extends Global {}
property absoluteBoundingBox
readonly absoluteBoundingBox: Rect;
Bounding box of the node in absolute space coordinates
property background
readonly background: ReadonlyArray<Paint>;
Background of the node. This is deprecated, as backgrounds for frames are now in the fills field.
property backgroundColor
readonly backgroundColor: Color;
Background color of the node. This is deprecated, as frames now support more than a solid color as a fills. Please use the fills field instead.
property blendMode
readonly blendMode: BlendMode;
How this node blends with nodes behind it in the scene (see blend mode section for more details)
property children
readonly children: ReadonlyArray<Node>;
An array of nodes that are direct children of this node
property clipsContent
readonly clipsContent: boolean;
Does this node clip content outside of its bounds?
property constraints
readonly constraints: LayoutConstraint;
Horizontal and vertical layout constraints for node
property cornerRadius
readonly cornerRadius?: number;
Radius of each corner of the frame if a single radius is set for all corners
property counterAxisAlignItems
readonly counterAxisAlignItems?: 'MIN' | 'CENTER' | 'MAX';
When autolayout is enabled
property counterAxisSizingMode
readonly counterAxisSizingMode?: 'FIXED' | 'AUTO';
The padding betweeen the bottom border of the frame and its children. This property is only applicable for auto-layout frames. 0
property effects
readonly effects: ReadonlyArray<Effect>;
An array of effects attached to this node (see effects sectionfor more details) []
property exportSettings
readonly exportSettings?: ReadonlyArray<ExportSetting>;
An array of export settings representing images to export from node []
property fills
readonly fills: ReadonlyArray<Paint>;
An array of fill paints applied to the node []
property horizontalPadding
readonly horizontalPadding?: number;
The horizontal padding between the borders of the frame and its children. This property is only applicable for auto-layout frames. 0
property isMask
readonly isMask?: boolean;
Does this node mask sibling nodes in front of it? false
property itemSpacing
readonly itemSpacing?: number;
The distance between children of the frame. This property is only applicable for auto-layout frames. 0
property layoutAlign
readonly layoutAlign?: string;
How the layer is aligned inside an auto-layout frame. This property is only provided for direct children of auto-layout frames. MIN CENTER MAX STRETCH In horizontal auto-layout frames, "MIN" and "MAX" correspond to "TOP" and "BOTTOM". * In vertical auto-layout frames, "MIN" and "MAX" correspond to "LEFT" and "RIGHT".
property layoutGrids
readonly layoutGrids?: ReadonlyArray<LayoutGrid>;
An array of layout grids attached to this node (see layout grids section for more details). GROUP nodes do not have this attribute []
property layoutMode
readonly layoutMode?: 'NONE' | 'HORIZONTAL' | 'VERTICAL';
Whether this layer uses auto-layout to position its children. NONE
property opacity
readonly opacity?: number;
Opacity of the node 1
property overflowDirection
readonly overflowDirection?: string;
Defines the scrolling behavior of the frame, if there exist contents outside of the frame boundaries. The frame can either scroll vertically, horizontally, or in both directions to the extents of the content contained within it. This behavior can be observed in a prototype. HORIZONTAL_SCROLLING VERTICAL_SCROLLING HORIZONTAL_AND_VERTICAL_SCROLLING NONE
property paddingBottom
readonly paddingBottom?: number;
The padding betweeen the top border of the frame and its children. This property is only applicable for auto-layout frames. 0
property paddingLeft
readonly paddingLeft?: number;
When autolayout is enabled
property paddingRight
readonly paddingRight?: number;
The padding betweeen the left border of the frame and its children. This property is only applicable for auto-layout frames. 0
property paddingTop
readonly paddingTop?: number;
The padding betweeen the right border of the frame and its children. This property is only applicable for auto-layout frames. 0
property preserveRatio
readonly preserveRatio?: boolean;
Keep height and width constrained to same ratio false
property primaryAxisAlignItems
readonly primaryAxisAlignItems?: 'MIN' | 'CENTER' | 'MAX' | 'SPACE_BETWEEN';
When autolayout is enabled
property primaryAxisSizingMode
readonly primaryAxisSizingMode?: 'FIXED' | 'AUTO';
Whether the counter axis has a fixed length (determined by the user) or an automatic length (determined by the layout engine). This property is only applicable for auto-layout frames AUTO
property rectangleCornerRadii
readonly rectangleCornerRadii?: readonly [number, number, number, number];
Array of length 4 of the radius of each corner of the frame, starting in the top left and proceeding clockwise
property relativeTransform
readonly relativeTransform?: Transform;
The top two rows of a matrix that represents the 2D transform of this node relative to its parent. The bottom row of the matrix is implicitly always (0, 0, 1). Use to transform coordinates in geometry. Only present if geometry=paths is passed
property size
readonly size?: Vector2;
Width and height of element. This is different from the width and height of the bounding box in that the absolute bounding box represents the element after scaling and rotation. Only present if geometry=paths is passed
property strokeAlign
readonly strokeAlign: 'INSIDE' | 'OUTSIDE' | 'CENTER';
Position of stroke relative to vector outline, as a string enum "INSIDE": stroke drawn inside the shape boundary "OUTSIDE": stroke drawn outside the shape boundary "CENTER": stroke drawn centered along the shape boundary
property strokes
readonly strokes: ReadonlyArray<Paint>;
An array of stroke paints applied to the node []
property strokeWeight
readonly strokeWeight: number;
The weight of strokes on the node
property transitionDuration
readonly transitionDuration?: number | null;
The duration of the prototyping transition on this node (in milliseconds) null
property transitionEasing
readonly transitionEasing?: EasingType | null;
The easing curve used in the prototyping transition on this node null
property transitionNodeID
readonly transitionNodeID?: string | null;
Node ID of node to transition to in prototyping null
property verticalPadding
readonly verticalPadding?: number;
The vertical padding between the borders of the frame and its children. This property is only applicable for auto-layout frames. 0
interface FrameInfo
interface FrameInfo {}
property background_color
readonly background_color: string;
Background color of the frame
property name
readonly name: string;
The name of the frame
property node_id
readonly node_id: string;
Id of the frame node within the figma file
property page_id
readonly page_id: string;
Id of the frame's residing page
property page_name
readonly page_name: string;
Name of the frame's residing page
interface FrameOffset
interface FrameOffset {}
A relative offset within a frame
property node_id
readonly node_id: string;
Unique id specifying the frame
property node_offset
readonly node_offset: Vector2;
2d vector offset within the frame
interface FullComponentMetadata
interface FullComponentMetadata extends SharedElement {}
An arrangement of published UI elements that can be instantiated across figma files
property containing_frame
readonly containing_frame: FrameInfo;
Data on component's containing frame, if component resides within a frame
property containing_page
readonly containing_page: any;
Data on component's containing page, if component resides in a multi-page file
interface FullStyleMetadata
interface FullStyleMetadata extends SharedElement {}
property sort_position
readonly sort_position: string;
A user specified order number by which the style can be sorted
property style_type
readonly style_type: StyleType;
The type of style
interface Global
interface Global {}
property id
readonly id: string;
a string uniquely identifying this node within the document
property name
readonly name: string;
the name given to the node by the user in the tool.
property pluginData
readonly pluginData?: any;
data written by plugins that is visible only to the plugin that wrote it. Requires the
pluginData
to include the ID of the plugin.
property sharedPluginData
readonly sharedPluginData?: any;
data written by plugins that is visible to all plugins. Requires the
pluginData
parameter to include the string "shared".
property type
readonly type: NodeType;
the type of the node, refer to table below for details
property visible
readonly visible?: boolean;
whether or not the node is visible on the canvas
interface Group
interface Group extends FrameBase {}
A logical grouping of nodes
property type
readonly type: 'GROUP';
interface Instance
interface Instance extends FrameBase {}
An instance of a component, changes to the component result in the same changes applied to the instance
property componentId
readonly componentId: string;
ID of component that this instance came from, refers to components table (see endpoints section below)
property type
readonly type: 'INSTANCE';
interface LayoutConstraint
interface LayoutConstraint {}
Layout constraint relative to containing Frame
property horizontal
readonly horizontal: 'LEFT' | 'RIGHT' | 'CENTER' | 'LEFT_RIGHT' | 'SCALE';
Horizontal constraint as an enum "LEFT": Node is laid out relative to left of the containing frame "RIGHT": Node is laid out relative to right of the containing frame "CENTER": Node is horizontally centered relative to containing frame "LEFT_RIGHT": Both left and right of node are constrained relative to containing frame (node stretches with frame) "SCALE": Node scales horizontally with containing frame
property vertical
readonly vertical: 'TOP' | 'BOTTOM' | 'CENTER' | 'TOP_BOTTOM' | 'SCALE';
Vertical constraint as an enum "TOP": Node is laid out relative to top of the containing frame "BOTTOM": Node is laid out relative to bottom of the containing frame "CENTER": Node is vertically centered relative to containing frame "TOP_BOTTOM": Both top and bottom of node are constrained relative to containing frame (node stretches with frame) "SCALE": Node scales vertically with containing frame
interface LayoutGrid
interface LayoutGrid {}
Guides to align and place objects within a frame
property alignment
readonly alignment: 'MIN' | 'MAX' | 'CENTER';
Positioning of grid as a string enum "MIN": Grid starts at the left or top of the frame "MAX": Grid starts at the right or bottom of the frame "CENTER": Grid is center aligned
property color
readonly color: Color;
Color of the grid
property count
readonly count: number;
Number of columns or rows
property gutterSize
readonly gutterSize: number;
Spacing in between columns and rows
property offset
readonly offset: number;
Spacing before the first column or row
property pattern
readonly pattern: 'COLUMNS' | 'ROWS' | 'GRID';
Orientation of the grid as a string enum "COLUMNS": Vertical grid "ROWS": Horizontal grid "GRID": Square grid
property sectionSize
readonly sectionSize: number;
Width of column grid or height of row grid or square grid spacing
property visible
readonly visible: boolean;
Is the grid currently visible?
interface Line
interface Line extends VectorBase {}
A straight line
property type
readonly type: 'LINE';
interface PaginationParams
interface PaginationParams {}
property cursor
readonly cursor?: { readonly before?: number; readonly after?: number;};
A map that indicates the starting/ending point from which objects are returned. The cursor value is an internally tracked integer that doesn't correspond to any Ids
property page_size
readonly page_size?: number;
Number of items in a paged list of results. 30
interface Paint
interface Paint {}
A solid color, gradient, or image texture that can be applied as fills or strokes
property blendMode
readonly blendMode: BlendMode;
How this node blends with nodes behind it in the scene (see blend mode section for more details)
property color
readonly color?: Color;
Solid color of the paint
property gifRef
readonly gifRef?: string;
A reference to the GIF embedded in this node, if the image is a GIF. To download the image using this reference, use the GET file images endpoint to retrieve the mapping from image references to image URLs
property gradientHandlePositions
readonly gradientHandlePositions?: ReadonlyArray<Vector2>;
This field contains three vectors, each of which are a position in normalized object space (normalized object space is if the top left corner of the bounding box of the object is (0, 0) and the bottom right is (1,1)). The first position corresponds to the start of the gradient (value 0 for the purposes of calculating gradient stops), the second position is the end of the gradient (value 1), and the third handle position determines the width of the gradient (only relevant for non-linear gradients).
property gradientStops
readonly gradientStops?: ReadonlyArray<ColorStop>;
Positions of key points along the gradient axis with the colors anchored there. Colors along the gradient are interpolated smoothly between neighboring gradient stops.
property imageRef
readonly imageRef?: string;
A reference to an image embedded in the file. To download the image using this reference, use the GET file images endpoint to retrieve the mapping from image references to image URLs
property imageTransform
readonly imageTransform?: Transform;
Affine transform applied to the image, only present if scaleMode is
STRETCH
property opacity
readonly opacity?: number;
Overall opacity of paint (colors within the paint can also have opacity values which would blend with this) 1
property scaleMode
readonly scaleMode?: ScaleMode;
Image scaling mode
property scalingFactor
readonly scalingFactor?: number;
Amount image is scaled by in tiling, only present if scaleMode is
TILE
property type
readonly type: PaintType;
Type of paint as a string enum
property visible
readonly visible?: boolean;
Is the paint enabled? true
interface Path
interface Path {}
property path
readonly path: string;
A sequence of path commands in SVG notation
property windingRule
readonly windingRule: 'EVENODD' | 'NONZERO';
Winding rule for the path
interface PostCommentParams
interface PostCommentParams {}
property client_meta
readonly client_meta?: Figma.Vector2 | Figma.FrameOffset;
The absolute canvas position of where to place the comment
property comment_id
readonly comment_id?: string;
The comment to reply to, if any. This must be a root comment, that is, you cannot reply to a comment that is a reply itself (a reply has a parent_id).
property message
readonly message: string;
The text contents of the comment to post
interface ProjectFilesResponse
interface ProjectFilesResponse {}
interface ProjectSummary
interface ProjectSummary {}
interface Rect
interface Rect {}
A rectangle that expresses a bounding box in absolute coordinates
interface Rectangle
interface Rectangle extends VectorBase {}
A rectangle
property cornerRadius
readonly cornerRadius?: number;
Radius of each corner of the rectangle if a single radius is set for all corners
property rectangleCornerRadii
readonly rectangleCornerRadii?: readonly [number, number, number, number];
Array of length 4 of the radius of each corner of the rectangle, starting in the top left and proceeding clockwise
property type
readonly type: 'RECTANGLE';
interface RegularPolygon
interface RegularPolygon extends VectorBase {}
A regular n-sided polygon
property type
readonly type: 'REGULAR_POLYGON';
interface Slice
interface Slice extends Global {}
A rectangular region of the canvas that can be exported
property absoluteBoundingBox
readonly absoluteBoundingBox: Rect;
Bounding box of the node in absolute space coordinates
property exportSettings
readonly exportSettings: ReadonlyArray<ExportSetting>;
An array of export settings representing images to export from this node
property relativeTransform
readonly relativeTransform?: Transform;
The top two rows of a matrix that represents the 2D transform of this node relative to its parent. The bottom row of the matrix is implicitly always (0, 0, 1). Use to transform coordinates in geometry. Only present if geometry=paths is passed
property size
readonly size?: Vector2;
Width and height of element. This is different from the width and height of the bounding box in that the absolute bounding box represents the element after scaling and rotation. Only present if geometry=paths is passed
property type
readonly type: 'SLICE';
interface Star
interface Star extends VectorBase {}
A regular star shape
property type
readonly type: 'STAR';
interface Style
interface Style {}
A description of styles used in a file.
property description
readonly description: string;
A description of the style
property key
readonly key: string;
The unique identifier of the style
property name
readonly name: string;
The name of the stlye
property styleType
readonly styleType: StyleType;
The type of style
interface StyleResponse
interface StyleResponse {}
interface TeamComponentSetsResponse
interface TeamComponentSetsResponse {}
interface TeamComponentsResponse
interface TeamComponentsResponse {}
interface TeamProjectsResponse
interface TeamProjectsResponse {}
interface TeamStylesResponse
interface TeamStylesResponse {}
interface Text
interface Text extends VectorBase {}
A text box
property characters
readonly characters: string;
Text contained within text box
property characterStyleOverrides
readonly characterStyleOverrides: ReadonlyArray<number>;
Array with same number of elements as characeters in text 'box' | * each element is a reference to the styleOverrideTable defined below and maps to the corresponding character in the characters field. Elements with value 0 have the default type style
property style
readonly style: TypeStyle;
Style of text including font family and weight (see type style section for more information)
property styleOverrideTable
readonly styleOverrideTable: { readonly [index: number]: TypeStyle;};
Map from ID to TypeStyle for looking up style overrides
property type
readonly type: TextType;
interface TypeStyle
interface TypeStyle {}
Metadata for character formatting
property fills
readonly fills?: ReadonlyArray<Paint>;
Paints applied to characters
property fontFamily
readonly fontFamily: string;
Font family of text (standard name)
property fontPostScriptName
readonly fontPostScriptName: string;
PostScript font name
property fontSize
readonly fontSize: number;
Font size in px
property fontWeight
readonly fontWeight: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
Numeric font weight
property italic
readonly italic?: boolean;
Is text italicized?
property letterSpacing
readonly letterSpacing: number;
Space between characters in px
property lineHeightPercent
readonly lineHeightPercent: number;
Line height as a percentage of normal line height
property lineHeightPercentFontSize
readonly lineHeightPercentFontSize?: number;
Line height as a percentage of the font size. Only returned when lineHeightPercent is not 100.
property lineHeightPx
readonly lineHeightPx: number;
Line height in px
property lineHeightUnit
readonly lineHeightUnit: 'PIXELS' | 'FONT_SIZE_%' | 'INTRINSIC_%';
The unit of the line height value specified by the user.
property paragraphIndent
readonly paragraphIndent?: number;
Paragraph indentation in px, 0 if not present
property paragraphSpacing
readonly paragraphSpacing?: number;
Space between paragraphs in px, 0 if not present
property textAlignHorizontal
readonly textAlignHorizontal: 'LEFT' | 'RIGHT' | 'CENTER' | 'JUSTIFIED';
Horizontal text alignment as string enum
property textAlignVertical
readonly textAlignVertical: 'TOP' | 'CENTER' | 'BOTTOM';
Vertical text alignment as string enum
property textCase
readonly textCase?: 'UPPER' | 'LOWER' | 'TITLE';
Text casing applied to the node, default is the original casing
property textDecoration
readonly textDecoration?: 'STRIKETHROUGH' | 'UNDERLINE';
Text decoration applied to the node, default is none
interface User
interface User {}
A description of a user
interface Vector
interface Vector extends VectorBase {}
A vector network, consisting of vertices and edges
property type
readonly type: 'VECTOR';
interface Vector2
interface Vector2 {}
A 2d vector
interface VectorBase
interface VectorBase extends Global {}
property absoluteBoundingBox
readonly absoluteBoundingBox: Rect;
Bounding box of the node in absolute space coordinates
property blendMode
readonly blendMode: BlendMode;
How this node blends with nodes behind it in the scene (see blend mode section for more details)
property constraints
readonly constraints: LayoutConstraint;
Horizontal and vertical layout constraints for node
property effects
readonly effects: ReadonlyArray<Effect>;
An array of effects attached to this node (see effects sectionfor more details) []
property exportSettings
readonly exportSettings?: ReadonlyArray<ExportSetting>;
An array of export settings representing images to export from node []
property fillGeometry
readonly fillGeometry?: ReadonlyArray<Path>;
Only specified if parameter geometry=paths is used. An array of paths representing the object fill
property fills
readonly fills: ReadonlyArray<Paint>;
An array of fill paints applied to the node []
property isMask
readonly isMask?: boolean;
Does this node mask sibling nodes in front of it? false
property opacity
readonly opacity?: number;
Opacity of the node 1
property preserveRatio
readonly preserveRatio?: boolean;
Keep height and width constrained to same ratio false
property relativeTransform
readonly relativeTransform?: Transform;
The top two rows of a matrix that represents the 2D transform of this node relative to its parent. The bottom row of the matrix is implicitly always (0, 0, 1). Use to transform coordinates in geometry. Only present if geometry=paths is passed
property size
readonly size?: Vector2;
Width and height of element. This is different from the width and height of the bounding box in that the absolute bounding box represents the element after scaling and rotation. Only present if geometry=paths is passed
property strokeAlign
readonly strokeAlign: 'INSIDE' | 'OUTSIDE' | 'CENTER';
Where stroke is drawn relative to the vector outline as a string enum "INSIDE": draw stroke inside the shape boundary "OUTSIDE": draw stroke outside the shape boundary "CENTER": draw stroke centered along the shape boundary
property strokeGeometry
readonly strokeGeometry?: ReadonlyArray<Path>;
Only specified if parameter geometry=paths is used. An array of paths representing the object stroke
property strokes
readonly strokes: ReadonlyArray<Paint>;
An array of stroke paints applied to the node []
property strokeWeight
readonly strokeWeight: number;
The weight of strokes on the node
property styles
readonly styles?: StylesObject;
Styles this node uses from the global
styles
property transitionDuration
readonly transitionDuration?: number | null;
The duration of the prototyping transition on this node (in milliseconds) null
property transitionEasing
readonly transitionEasing?: EasingType | null;
The easing curve used in the prototyping transition on this node null
property transitionNodeID
readonly transitionNodeID?: string | null;
Node ID of node to transition to in prototyping null
interface VersionMetadata
interface VersionMetadata {}
property created_at
readonly created_at: string;
The UTC ISO 8601 time at which the version was created
property description
readonly description: string;
The description of the version as entered in the editor
property id
readonly id: string;
Unique identifier for version
property label
readonly label: string;
The label given to the version in the editor
property user
readonly user: User;
The user that created the version
Type Aliases
type BlendMode
type BlendMode = | 'PASS_THROUGH' /** (Only applicable to objects with children) */ | 'NORMAL' /** Darken: */ | 'DARKEN' | 'MULTIPLY' | 'LINEAR_BURN' | 'COLOR_BURN' /** Lighten: */ | 'LIGHTEN' | 'SCREEN' | 'LINEAR_DODGE' | 'COLOR_DODGE' /** Contrast: */ | 'OVERLAY' | 'SOFT_LIGHT' | 'HARD_LIGHT' /** Inversion: */ | 'DIFFERENCE' | 'EXCLUSION' /** Component: */ | 'HUE' | 'SATURATION' | 'COLOR' | 'LUMINOSITY';
how the layer blends with layers below
type EasingType
type EasingType = | 'EASE_IN' /** Ease in with an animation curve similar to CSS ease-in */ | 'EASE_OUT' /** Ease out with an animation curve similar to CSS ease-out */ | 'EASE_IN_AND_OUT';
type exportFormatOptions
type exportFormatOptions = 'jpg' | 'png' | 'svg' | 'pdf';
type Node
type Node = | Document | Canvas | Frame | Group | Vector | BooleanOperation | Star | Line | Ellipse | RegularPolygon | Rectangle | Text | Slice | Component | ComponentSet | Instance;
type NodeType
type NodeType = | 'DOCUMENT' | 'CANVAS' | 'FRAME' | 'GROUP' | 'VECTOR' | 'BOOLEAN_OPERATION' | 'STAR' | 'LINE' | 'ELLIPSE' | 'REGULAR_POLYGON' | 'RECTANGLE' | 'TEXT' | 'SLICE' | 'COMPONENT' | 'COMPONENT_SET' | 'INSTANCE';
type PaintType
type PaintType = PaintTypeSolid | PaintTypeGradient | PaintTypeImage;
type PaintTypeGradient
type PaintTypeGradient = | 'GRADIENT_LINEAR' | 'GRADIENT_RADIAL' | 'GRADIENT_ANGULAR' | 'GRADIENT_DIAMOND';
type PaintTypeImage
type PaintTypeImage = 'IMAGE' | 'EMOJI';
type PaintTypeSolid
type PaintTypeSolid = 'SOLID';
type RoleType
type RoleType = 'viewer' | 'editor' | 'owner';
type ScaleMode
type ScaleMode = 'FILL' | 'FIT' | 'TILE' | 'STRETCH';
type StyleKeyType
type StyleKeyType = 'fill' | 'stroke' | 'effect' | 'grid' | 'text' | 'background';
the above styles can be used in the following ways
type StylesObject
type StylesObject = { [key in StyleKeyType]: Record<key, string>;}[StyleKeyType];
type StyleType
type StyleType = 'FILL' | 'TEXT' | 'EFFECT' | 'GRID';
Styles can be one of the following types
type TextType
type TextType = 'TEXT';
type Transform
type Transform = ReadonlyArray<ReadonlyArray<number>>;
Package Files (2)
Dependencies (1)
Dev Dependencies (17)
Peer Dependencies (0)
No peer dependencies.
Badge
To add a badge like this oneto your package's README, use the codes available below.
You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/figma-js
.
- Markdown[![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/figma-js)
- HTML<a href="https://www.jsdocs.io/package/figma-js"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>
- Updated .
Package analyzed in 7054 ms. - Missing or incorrect documentation? Open an issue for this package.