Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/craigmdennis/figma-apply-colors-to-selection

figma generator plugin random swatches typescript

Last synced: 3 months ago
JSON representation

Apply a set of colors randomly to a selection

Host: GitHub
URL: https://github.com/craigmdennis/figma-apply-colors-to-selection
Owner: craigmdennis
Created: 2020-03-27T10:39:12.000Z (over 4 years ago)
Default Branch: master
Last Pushed: 2020-04-15T12:40:58.000Z (over 4 years ago)
Last Synced: 2024-07-18T14:42:52.291Z (4 months ago)
Topics: figma, generator, plugin, random, swatches, typescript
Language: TypeScript
Homepage: https://www.figma.com/community/plugin/830583682222038085/Apply-Colors-to-Selection
Size: 892 KB
Stars: 4
Watchers: 2
Forks: 0
Open Issues: 2
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml

![](./assets/figma-cover.png)

# Apply Color to Selection

1. (Optional) Before opening the plugin, select the element(s) who's fill color you want to use as a swatch.

2. Open the plugin and add/remove any swatches you want. Adding a new one will generate a new random color.

3. Back on the canvas, select all the elements you want and hit "Apply Colors". The selection will be filled randomly using the swatches.

![Github Heat Map Demo](./src/assets/figma-plugin-github-heatmap-demo.gif)

The plugin doesn't automatically close so you can hit "Apply Colors" as many times as you like.

**HINT**: If you want more of one color than any others, add more swatches of that color.

---

## Build instructions

First clone the repository and install the dev dependencies:

```
git clone [email protected]:craigmdennis/figma-apply-colors-to-selection.git
cd figma-apply-colors-to-selection
npm install
```

Then compile the source files:

```
npm run watch
```

The main plugin code is in `src/code.ts`. The HTML for the UI is in
`src/ui.html`, while the embedded JavaScript is in `src/ui.ts`.

These are compiled to files in `dist/`, which are what Figma will use to run
your plugin.