Theme Switcher

About this plugin

Figma Theme Switcher allows you to easily switch between two color styles applied to selected layers.

How It Works

Figma Theme Switcher finds matching set of color styles based on the user input and "switch" between them.

For example, if you want to switch theme from Light to Dark, type in "Light" for current input and "Dark" for target input then click "Switch". All of the selected layers will then be switched to the targeted "Dark" theme.

Keywords are not limited to Light/Dark and can be anywhere in the color style name.

• Light/Text/Primary => Dark/Text/Primary
• Text/Primary (Light) => Text/Primary (Dark)
• V1/Text/Primary => V2/Text/Primary

Figma Theme Switcher even works with external color styles by saving them inside the plugin storage.

Basic Usage (Local Color Styles)

If your color styles are in your current file, follow steps below.

1. Run Figma Theme Switcher
2. Select layers
3. Type in part of color styles name which describes a set of themes in current and target field (e.g. Light/Dark)
4. Click "Switch"

Advanced Usage (External Color Styles)

If your color styles are in a different file (or library), follow steps below.

1. Open a Figma file that has target color styles defined
2. Run Figma Theme Switcher
3. Switch to "Library Color Styles" tab
4. Click "Save Color Styles from current file"
5. Select layers
6. Type in part of color styles name which describes a set of themes in current and target field (e.g. Light/Dark)
7. Click "Switch"

Acknowledgments

Figma Theme Switcher is inspired by these awesome plugins.

• https://github.com/rei-suzuki/figma-dark-mode-switcher
• https://github.com/glmrvn/Appearance-figma-plugin

Support

[email protected]