DocsTools
Figma
Read and edit Figma files.
- Category
- Design
- How you connect
- Sign in. You sign in with your account. Homla never sees your password.
- Time to set up
- About 1 minutes
- Actions
- 25 read, 11 write
Connect it#
In Homla, open Connectors, then Figma. The Setup guide button walks you through the same steps, with fields to paste into.
Who can do it. Each person connects their own Figma account. Any Figma user can connect. To read a file, the account must be able to open it; to change a design (use_figma, upload_assets, generate_figma_design), it needs edit access to that file. A View or Collab seat works for reads but has a very small monthly quota.
- Open Figma in Homla and click ConnectIn Homla, open Connectors, then Figma, then Connect my Figma account. Figma opens in a new window. Open it.
- Sign in with the Figma account that has the filesIf you have several Figma accounts (personal and work), check the email at the top of Figma's screen before you continue. Homla will see exactly the files this account can open, nothing more.
- Allow access on Figma's consent screenFigma asks for one permission, mcp:connect: use Figma's MCP tools as you. It covers every Figma tool in Homla, reads and writes alike. What each person can actually do is then set in Homla: a read-only role only ever sees the read tools, and every write asks for confirmation first. Click Allow access; you land back in Homla, connected.
use_figma runs code in your file with your rights: it can delete pages. Read what it will run in the confirmation before you approve it.
- Check it worksAsk your assistant "which Figma account am I connected as?" (figma_whoami). Then paste a figma.com link to a frame and ask for a screenshot of it.
- If something goes wrong"The connected Figma account cannot open that file": ask for access to the file in Figma, or reconnect with the account that has it. A write is refused: the account has view-only access to that file; ask for edit access. Rate limit reached: View and Collab seats have a small quota; a Dev or Full seat raises it. "Connect Figma in the Homla dashboard": the connection expired or was revoked; click Connect again.
What your AI can do#
These are the actions Homla gives your AI. Your role decides which ones you get. Write actions are a dry run until confirmed, see Approvals and dry runs.
Read#
Looks things up, never changes anything.
| Action | What it does |
|---|---|
figma_get_design_context | Design-to-code context for one node: reference code, a screenshot and metadata. |
figma_get_screenshot | Render a node as a PNG and return a short-lived download URL. |
figma_get_metadata | XML outline of a node or page: ids, layer types, names, positions, sizes. |
figma_get_variable_defs | Variables (colors, spacing, type) bound anywhere under a node, as name to value. |
figma_search_design_system | Find components, variables and styles across the file's design libraries. |
figma_get_libraries | Design libraries for a file: those already added, and those available to add. |
figma_get_motion_context | Keyframe animation data for a node: tracks, easing curves, and ready-made CSS @keyframes and motion.dev snippets. |
figma_get_figjam | Read a FigJam board node. |
figma_download_assets | Download a node's assets: an export of the node, the original source images in its subtree, and SVGs of its vector layers. |
figma_export_video | Export a timeline frame as MP4 and return a presigned URL. |
figma_get_code_connect_map | Existing Code Connect mappings under a node: node id to source path and component name in the codebase. |
figma_get_code_connect_suggestions | Suggested Code Connect links between a node's components and code. |
figma_get_context_for_code_connect | Properties, variants and descendant tree for one component or component set. |
figma_list_file_components_for_code_connect | Every component published to a file's library, with the dependency graph, for planning Code Connect in bulk. |
figma_list_shaders | Shader effects and fills in the account library: id, name, description, owner, type. |
figma_get_shader | Read one shader effect or fill: name, description, type, version and a manifest of its source files. |
figma_list_file_shaders | Shader effects and fills used in one file, including ones you do not own, with a manifest of source files. |
figma_list_generative_plugins | Generative plugins in the account library: id, name, description, owner. |
figma_get_generative_plugin | Read one generative plugin: name, description, owner, version and a manifest of its source files. |
figma_weave_find_model | Find a Weave AI model by name (e.g. |
figma_weave_get_model_run_output | Status and output of Weave model runs. |
figma_whoami | The connected Figma account: handle, email, and every plan it belongs to with each plan key. |
figma_weave_list_tools | Weave tools (published Weave workflows) the account can run. |
figma_weave_get_tool_inputs | The input contract of a Weave tool: each input's nodeId, type, default and whether it is required. |
figma_weave_get_tool_run_output | Status and output of Weave tool runs. |
Write#
Creates or changes things, as the account owner.
| Action | What it does |
|---|---|
figma_use_figma Deletes | Run JavaScript against the Figma Plugin API in one file: create, edit or inspect nodes, variables, styles and layout. |
figma_create_new_file | Create a blank Figma design, FigJam or Slides file and return its key and URL. |
figma_generate_figma_design | Capture a live web page into an existing Figma file. |
figma_generate_diagram | Create a FigJam diagram from Mermaid.js: flowchart, sequence, state, gantt or ER. |
figma_upload_assets | Get single-use upload URLs for images or SVGs, then POST the bytes to each with the right Content-Type. |
figma_add_code_connect_map | Map one Figma node to a code component, or attach a full Code Connect template when template is given. |
figma_send_code_connect_mappings | Save Code Connect mappings in bulk, after reviewing get_code_connect_suggestions with the user. |
figma_weave_run_tool | Run a Weave tool. |
figma_weave_run_model | Run a Weave AI model directly. |
figma_weave_cancel_tool_run Deletes | Cancel in-progress Weave runs. |
figma_weave_upload_asset | Get a single-use Weave upload URL and token for a local image or video, to pass as an image input to weave_run_tool. |
Disconnect it#
In Homla, open the account menu on the tool's page and choose Disconnect. Anyone it was shared with loses access at once. To cut it off on the tool's side too:
To cut Homla off, open Figma Settings, Security tab, and remove Homla from the connected apps. Or click Disconnect on the Figma page in Homla. To reconnect, click Connect again.
Generated from the product code. Action names are what the CLI and the API use.