Toolabs Design System Manager
<p>✦ Design Tokens, Theme Management and more...</p><p><br></p><p>Define or update design tokens in one single panel, right from Figma.</p><p>And, immediately see the changes cascading through your Figma design.</p><p><br></p><p>✦ Manage Figma Styles with DSM Plugin</p><p><br></p><p>Selected Figma items are grouped by their styles and listed in the Selection Tab of the plugin.</p><p>For each distinct style group, you can apply following actions to Figma items having this style :</p><p>➥ Create and attach to New Token for each single style</p><p>➥ Tokenize All styles</p><p>➥ Select and attach to an Existing Token</p><p>Or</p><p>➥ Select,</p><p>➥ Delete,</p><p>➥ Zoom to selected items with this style.</p><p><br></p><p>✦ Use Real Content in your designs</p><p><br></p><p>You can easily populate your design with real data from Content tab of DSM plugin.</p><p><br></p><p>When you click a data field on the plugin, all selected Figma layer items will be filled with relevant text or image data. You can also create custom data collections to be used as real content.</p><p><br></p><p>✦ Document your Design System</p><p><br></p><p>Build your design system documents with an easy to use editor like <a href="http://Medium.com." rel="noreferrer noopener nofollow" target="_blank">Medium.com.</a> Enhanced with design systems related customizable widgets!</p><p><br></p><p>✦ Design to Code</p><p><br></p><p>➥ Programmatically access to design tokens from GraphQL API, or</p><p>➥ Use Export Widgets in documentation to export design tokens in various formats, e.g. CSS, Less, Sass, JSON, YAML, Js, Swift or Android.</p><p><br></p><p>Learn more at :</p><p>➥ <a href="https://www.toolabs.com/plugins/figma/" rel="noreferrer noopener nofollow" target="_blank">https://www.toolabs.com/plugins/figma/</a></p><p><br></p><p>🛠 Known Issues : Figma Plugin API does not allow to modify Team Library styles, because of this limitation, DSM design tokens can not be synced with team library styles.</p>
Plugin Preview
About this plugin
✦ Design Tokens, Theme Management and more...
Define or update design tokens in one single panel, right from Figma.
And, immediately see the changes cascading through your Figma design.
✦ Manage Figma Styles with DSM Plugin
Selected Figma items are grouped by their styles and listed in the Selection Tab of the plugin.
For each distinct style group, you can apply following actions to Figma items having this style :
➥ Create and attach to New Token for each single style
➥ Tokenize All styles
➥ Select and attach to an Existing Token
Or
➥ Select,
➥ Delete,
➥ Zoom to selected items with this style.
✦ Use Real Content in your designs
You can easily populate your design with real data from Content tab of DSM plugin.
When you click a data field on the plugin, all selected Figma layer items will be filled with relevant text or image data. You can also create custom data collections to be used as real content.
✦ Document your Design System
Build your design system documents with an easy to use editor like Medium.com. Enhanced with design systems related customizable widgets!
✦ Design to Code
➥ Programmatically access to design tokens from GraphQL API, or
➥ Use Export Widgets in documentation to export design tokens in various formats, e.g. CSS, Less, Sass, JSON, YAML, Js, Swift or Android.
Learn more at :
➥ https://www.toolabs.com/plugins/figma/
🛠 Known Issues : Figma Plugin API does not allow to modify Team Library styles, because of this limitation, DSM design tokens can not be synced with team library styles.
Plugin Details
Version | 38 |
---|---|
Created | July 8, 2020 |
Last Updated | November 24, 2021 |
Category | Software development |
Creator | Namık Özgür Aydın |
Stats | 6432 installs, 441 likes |
Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/ui.html
- main:dist/code.js
- Editor Types:figma
More Like This
Discover other plugins in the Software development category.