# Export colors as code or Figma variables

> Download or copy your colors as a token file, or create Figma variables from them.

## Goal

Get your extracted colors into code or into a Figma variable collection.

## Before you start

- A color list in Color Extractly.

## Steps

1. **Export as code** Click Code Token to open Export Variables as Code Token. Choose a Format: CSS, JSON, JSON (Figma), SCSS, SCSS Map, LESS, ESM, CJS, Tailwind, Android XML, iOS Swift or Web Tokens (DTCG).
2. **Download or copy** Click Download to save the file, or use the copy button to copy the code to the clipboard.
3. **Create Figma variables** Open the color list's menu and choose Import to Variables. The collection is named after the imported token file, or Extracted Colors if the colors did not come from a file.

## Tips

- Rename your colors first, so the exported tokens carry the names you want.

## Result

Your colors exist as a token file or as Figma variables.

## Common questions

### Which export formats are there?

CSS, JSON, JSON (Figma), SCSS, SCSS Map, LESS, ESM, CJS, Tailwind, Android XML, iOS Swift and Web Tokens (DTCG).

## Related guides

- [Combine similar colors and name them](https://raiken.io/kb/colorextractly/colorextractly-clean-up-and-name): Use Magic Clean to reduce duplicates and Rename to give every color a consistent name.
- [Extract colors from CSS, code or text](https://raiken.io/kb/colorextractly/colorextractly-extract-css): Paste CSS, SCSS, LESS or any text that holds color values and turn them into a color list.

---

Source: https://raiken.io/kb/colorextractly/colorextractly-export-and-variables (Color Extractly help centre). Reviewed: 2026-10-30.