Figma
Askel connects to your customer's Figma team and lets your product read design files, extract component metadata, and pull comments, bridging the gap between design assets and the rest of your customer's toolchain.
What you can do
Read file structure and node tree
Fetch the full node tree of a Figma file, including frames, components, groups, and text layers, with their properties such as size, position, fill, and type.
Export node images
Request PNG, SVG, JPG, or PDF renders of specific nodes or frames using the images endpoint. Useful for generating previews or exporting assets to attach elsewhere.
Read published components and styles
List the published components, component sets, and styles in a team library, including component descriptions and key values for referencing in your product.
Read and post comments
Fetch comments on a file and post new threaded comments programmatically, useful for notifying stakeholders of automated findings or linking back to your product.
List files and projects in a team
Enumerate the projects and files in a Figma team so your product can present a file picker without requiring manual URL copying.
Read version history
Fetch a file's version history to identify when a design was last updated, useful for triggering downstream workflow steps when a design changes.
Extracting component names and descriptions for a design-system registry
You sell a design-system management tool. Prism Studio maintains all their components in a Figma team library. When a component is published in Figma, your product should automatically update its design-system registry with the component name, description, and a PNG preview.
- 1
Generate a Personal Access Token
Prism Studio's Figma admin navigates to figma.com/settings, scrolls to Personal access tokens, creates a token, and pastes it into your product's integration settings.
- 2
List team files
Askel calls the team projects and files endpoints to enumerate all files Prism has shared. Your CS team selects the Design System file as the source.
- 3
Read published components
Askel fetches the published components from the file using the file components endpoint, returning component keys, names, and descriptions.
- 4
Export component previews
For each component, Askel calls the images endpoint to request a PNG render at 2x resolution. The image URLs are stored in your product's registry.
- 5
Update the registry
Your product upserts each component into its design-system registry with the Figma key as the unique identifier. Components not in Figma are marked as deprecated.
API token
The customer's Figma user navigates to figma.com/settings and creates a Personal Access Token in the Personal access tokens section. Askel stores the token securely. Figma Personal Access Tokens have the same permissions as the user who created them, scoped to the teams and files that user can access.
How Askel sits between your product and the customer's system
FAQ for Figma
Does this work with Figma organization accounts as well as individual teams?+
Can we access files in Figma Drafts?+
Is there a limit on image export sizes?+
What happens when a file is renamed or moved to a different project?+
catching drift before it breaks, and hitting go-live dates.
© 2025 Askel.ai. All rights reserved.