Lucidi for Figma
Create & sync opacity styles based on primary opaque color styles in Figma.
About
Figma doesn't support maintaining layer style while changing opacity, so designers have to keep and update color styles for multiple opacities. Doing this manually can become a nightmare, so I made a plugin to automatically create, sync and update these styles.
Features
Quickly create opacity styles based of current solid color styles
- Enter a list of opacities you need in your color library;
- Write a pattern for style name (e.g. $N-alpha$A will turn into primary-alpha50 );
- Press "Create & sync styles".
Sync your existing colors when solid solid opaque colors change
Don't manually update values of opacity colors styles, just change your main color style and start the plugin.
Clean up unused opacity styles
Optionally rewrite and delete opacity styles that don't match your parameters.
Running the project locally
-
Clone the repo
git clone https://github.com/dimuuu/lucidi.git
-
Install NPM packages
pnpm install
-
Run & build plugin
pnpm run dev
License
Distributed under the CC0 License. See LICENSE for more information.
Contact
Twitter: @dimuuu_
Email: dmytro.kondakov@gmail.com