Appearance
<p>This plugin generates a dark/light theme from your selection.</p><p>The plugin works with external library styles and local styles.</p><p>You can choose styles name identification in settings. By default, the plugin use [day] for light and [night] for dark.</p><p><br></p><p><strong>🤓 How it works:</strong></p><p>1. Use [day] and [night] in your style names. Example: Style name[day]/ Style name[night].</p><p>2. Apply your color styles.</p><p>3. Select any object, then choose Appearance → Dark mode or Appearance → Light mode.</p><p><br></p><p><strong>📔 How it works with external library styles:</strong></p><p>1. Open external library file and use [day] and [night] in color style names. Example: Style name[day]/ Style name[night].</p><p>2. Publish changes.</p><p>3. Select Appearance → Save styles for saving external color styles to the plugin.</p><p>4. Open any file linked to the library.</p><p>5. Apply color styles.</p><p>6. Select any object then choose Appearance → Dark mode or Appearance → Light mode</p><p><br></p><p>---</p><p><br></p><p><strong>✏️ Name examples:</strong></p><p>You can use [day] / [night] at any place of your style names.</p><p><br></p><p><br></p><p><br></p><p>Color name [day]</p><p>Color name [night]</p><p><br></p><p><br></p><p><br></p><p>Style [day] / color-name</p><p>Style [night] / color-name</p><p><br></p><p><br></p><p><br></p><p>Style / color-name [day]</p><p>Style / color-name [night]</p>
Plugin Preview
About this plugin
This plugin generates a dark/light theme from your selection.
The plugin works with external library styles and local styles.
You can choose styles name identification in settings. By default, the plugin use [day] for light and [night] for dark.
🤓 How it works:
1. Use [day] and [night] in your style names. Example: Style name[day]/ Style name[night].
2. Apply your color styles.
3. Select any object, then choose Appearance → Dark mode or Appearance → Light mode.
📔 How it works with external library styles:
1. Open external library file and use [day] and [night] in color style names. Example: Style name[day]/ Style name[night].
2. Publish changes.
3. Select Appearance → Save styles for saving external color styles to the plugin.
4. Open any file linked to the library.
5. Apply color styles.
6. Select any object then choose Appearance → Dark mode or Appearance → Light mode
---
✏️ Name examples:
You can use [day] / [night] at any place of your style names.
Color name [day]
Color name [night]
Style [day] / color-name
Style [night] / color-name
Style / color-name [day]
Style / color-name [night]
Plugin Details
Version | 24 |
---|---|
Created | October 1, 2019 |
Last Updated | November 15, 2022 |
Category | shapes-colors |
Creator | Alex Dyakov |
Stats | 25611 installs, 1140 likes |
Pricing | Free |
Technical Details
- API:1.0.0
- UI:ui.html
- main:code.js
- Editor Types:figma
More Like This
Discover other plugins in the shapes-colors category.