> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.knapsack.cloud/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.knapsack.cloud/_mcp/server.

# Figma Plugin

#### [Install Knapsack Figma Plugin](https://www.figma.com/community/plugin/1389668240886562403/knapsack)

Get the Knapsack plugin for Figma to easily export and import design variables, ensuring consistency between your Figma designs and Knapsack system.

## What This Plugin Does

This plugin helps you bring your Figma variables directly into Knapsack, keeping your design system in sync.

## Three Simple Steps

Exporting your design variables from Figma is straightforward with the Knapsack Figma Plugin. Follow these steps to generate a JSON file of your variables:

### 1. Install the Knapsack Plugin in Figma

* Go to the Figma Plugin Directory
* Search for "Knapsack"
* Click "Install"

### 2. Export Your Figma Variables

* Open your Figma file
* Go to Plugins > Knapsack
* Click "Export Variables"
* Save the JSON file

### 3. Import into Knapsack

* Open Knapsack
* Go to Design Variables page
* Click "Import Figma Variables"
* Upload the JSON file you saved
* Click "Import Variables"

That's it! Your Figma variables are now in Knapsack.

![](https://fdr-prod-docs-files-public.s3.us-east-1.amazonaws.com/knapsack-docs.docs.buildwithfern.com/d7af146c8e7da2270435fb4b100adf725ec89ed1706d329c60997d86cefd95c3/docs/assets/images/97e2236c-scr-20250414-myfd--dE3oGKyrJO.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIA6KXJSKKNFOCF7G4B%2F20260724%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20260724T211435Z&X-Amz-Expires=604800&X-Amz-Signature=d9a771cb5edd2fff7bd1b65f0389d20df5410cc99c859ea3145530d752c014f9&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject)