# Extract colors from CSS, code or text

> Paste CSS, SCSS, LESS or any text that holds color values and turn them into a color list.

## Goal

Pull every color out of a stylesheet or code snippet into Color Extractly.

## Before you start

- Color Extractly installed in Figma.
- CSS, SCSS, LESS or other text that contains color values.

## Steps

1. **Open Color Extractly** Run Color Extractly from the Plugins menu and stay on the Colors tab.
2. **Choose From Text / Code** Click the From Text / Code icon on the start screen. Its tooltip reads From Text / Code.
3. **Paste your source** Paste the text. Color Extractly reads hex values (3, 4, 6 and 8 digits), rgb() and rgba(), hsl() and hsla(), CSS named colors, CSS custom property definitions, and SCSS and LESS variables.
4. **Extract** Click the extract button below the text field (it reads Extract Colors on the Colors tab). The colors appear as a list you can clean up, name and export.

## Tips

- The start screen has more sources, shown as icons: From Selection, From Image, Figma Variables & Styles, Import Token File and Start From Scratch.

## Result

The colors from your text are listed in Color Extractly.

## Common questions

### Which color formats does Color Extractly read from text?

Hex values (3, 4, 6 and 8 digits), rgb() and rgba(), hsl() and hsla(), CSS named colors, CSS custom property definitions and SCSS or LESS variables.

### Can I extract colors without code?

Yes. Choose From Selection to read colors from your Figma selection, or From Image to extract the palette of an image.

## 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.
- [Export colors as code or Figma variables](https://raiken.io/kb/colorextractly/colorextractly-export-and-variables): Download or copy your colors as a token file, or create Figma variables from them.

---

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