Figma API ​

Basic API client for Figma. You can find some usage examples in these references:

• Export API
• Recipe: Traverse Figma File

declare function createFigmaApi(params: CreateFigmaApiParams): FigmaApi;

const figma = createFigmaApi({
  /* ... */
});

declare function createFigmaApi(params: CreateFigmaApiParams): FigmaApi;

const figma = createFigmaApi({
  /* ... */
});

CreateFigmaApiParams ​

export interface CreateFigmaApiParams {
  /**
   * The base URL of the Figma API (with version).
   * @default 'https://api.figma.com/v1'
   */
  baseUrl?: string;
  /**
   * The fetch function to use.
   * @default globalThis.fetch
   * @attention Will be replaced with our fetch client in the future.
   */
  fetch?: typeof fetch;
  /**
   * The logger implementation.
   * @see `@neodx/logger`
   * @default Logger with `debug` level.
   */
  log?: LoggerMethods<'info' | 'error' | 'debug'>;
  /**
   * The access token of the Figma API (OAuth2).
   * @see https://www.figma.com/developers/api#access-tokens
   */
  accessToken?: string;
  /**
   * The personal access token of the Figma API.
   * @default process.env.FIGMA_TOKEN
   * @see https://www.figma.com/developers/api#access-tokens
   */
  personalAccessToken?: string;
}

export interface CreateFigmaApiParams {
  /**
   * The base URL of the Figma API (with version).
   * @default 'https://api.figma.com/v1'
   */
  baseUrl?: string;
  /**
   * The fetch function to use.
   * @default globalThis.fetch
   * @attention Will be replaced with our fetch client in the future.
   */
  fetch?: typeof fetch;
  /**
   * The logger implementation.
   * @see `@neodx/logger`
   * @default Logger with `debug` level.
   */
  log?: LoggerMethods<'info' | 'error' | 'debug'>;
  /**
   * The access token of the Figma API (OAuth2).
   * @see https://www.figma.com/developers/api#access-tokens
   */
  accessToken?: string;
  /**
   * The personal access token of the Figma API.
   * @default process.env.FIGMA_TOKEN
   * @see https://www.figma.com/developers/api#access-tokens
   */
  personalAccessToken?: string;
}

FigmaApi ​

For details about the Figma API, see Figma API Reference or our Types for Figma API.

Files ​

• getFile({ id, ...params }: GetFileParams): GetFileResult

  GET /v1/files/:key

• getFileNodes<Node extends AnyNode>({ id, ...params }: GetFileNodesParams): GetFileNodesResult<Node>

  GET /v1/files/:key/nodes

• getImage({ id, ...params }: GetImageParams): GetImageResult

  GET /v1/images/:key

• getImageFills({ id }: GetImageFillsParams): GetImageFillsResult

  GET /v1/files/:key/images

Comments ​

• getComments({ id }: GetCommentsParams): GetCommentsResult

  GET /v1/files/:file_key/comments

• postComments({ id, ...body }: PostCommentsParams): PostCommentResult

  POST /v1/files/:file_key/comments

• deleteComments({ id, comment_id }: DeleteCommentsParams): void

  DELETE /v1/files/:file_key/comments/:comment_id

Users ​

• getMe(): GetUserMeResult

  GET /v1/me

Versions ​

• getVersions({ id }: GetVersionsParams): GetVersionsResult

  GET /v1/files/:key/versions

Teams and projects ​

• getTeamProjects({ team_id }: GetTeamProjectsParams): GetTeamProjectsResult

  GET /v1/teams/:team_id/projects

• getProjectFiles({ project_id }: GetProjectFilesParams): GetProjectFilesResult

  GET /v1/projects/:project_id/files

Components and styles ​

• getTeamComponents({ team_id }: GetTeamComponentsParams): GetTeamComponentsResult

  GET /v1/teams/:team_id/components

• getFileComponents({ id }: GetFileComponentsParams): GetFileComponentsResult

  GET /v1/files/:file_key/components

• getComponent({ key }: GetComponentParams): GetComponentResult

  GET /v1/components/:key

• getTeamComponentSets({ team_id }: GetTeamComponentSetsParams): GetTeamComponentSetsResult

  GET /v1/teams/:team_id/component_sets

• getFileComponentSets({ id }: GetFileComponentSetsParams): GetFileComponentSetsResult

  GET /v1/files/:file_key/component_sets

• getComponentSet({ key }: GetComponentSetParams): GetComponentSetResult

  GET /v1/component_sets/:key

• getTeamStyles({ team_id }: GetTeamStylesParams): GetTeamStylesResult

  GET /v1/teams/:team_id/styles

• getFileStyles({ id }: GetFileStylesParams): GetFileStylesResult

  GET /v1/files/:file_key/styles

• getStyle({ key }: GetStyleParams): GetStyleResult

  GET /v1/styles/:key

Variables ​