Toolabs Design System Manager
✦ 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 PluginSelected 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 TokenOr➥ Select,➥ Delete,➥ Zoom to selected items with this style.✦ Use Real Content in your designsYou 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 SystemBuild 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 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 PluginSelected 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 TokenOr➥ Select,➥ Delete,➥ Zoom to selected items with this style.✦ Use Real Content in your designsYou 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 SystemBuild 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 | 6506 installs, 448 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.
Figma to Code (HTML, Tailwind, Flutter, SwiftUI)
Code Conversion Made Easy: Figma to Web & Apps
Builder.io - Figma to Code & AI Apps (React, Vue, Tailwind, etc)
Export designs to clean, responsive code or turn Figma screens into AI apps and prototypes.
SkewDat
Skew any layer or group with all layers preserved to edit.