Warlock DX

About this plugin

Warlock DX – Tokens and Design System ToolsPlugin for teams using or building design systems: extract tokens from Figma and generate ready-to-use variables for your files, then exportthem in multiple code formats.Token Extraction- Export primitive and semantic tokens from Figma's Variables and Styles.- Output in W3C Design Tokens (JSON) format, compatible with Style Dictionaries and token pipelines.- Options: primitives only, semantic only, or all.Export Code (Multi-Format)Export your tokens in multiple code formats ready to use:- CSS Custom Properties – Native CSS variables (:root)- SCSS Variables – Variables and maps for Sass- Tailwind Config – Configuration for tailwind.config.js- TypeScript – Typed constants object- Swift (iOS) – SwiftUI/UIKit extensions- Kotlin (Android) – Objects for Jetpack Compose- W3C Design Tokens – Standard JSON formatPreview code before exporting. Select multiple formats at once.Scale GeneratorsCreate Figma variables from generated scales:- Colors – Palette from a base color (50-950 shades)- Sizes – Spacing and dimension scales- Typography – Font size scales with harmonic ratios- Border Radius – Radius scales (sm, md, lg, xl, full)- Shadows – Elevation scales (y-offset, blur)- Opacity – Standard opacity scales (0-100%)Similar ElementsSelect one or more elements and search the page for similar nodes.- Filters: same node type, similar size (±10%), same color (solid fill)- Results list with type, size, and badges for Component/Instance- Navigate to elements or their main componentsToolsExtract colorsImport variables (json,scss,css)Doc:doc for components---Useful for: maintaining visual consistency, documenting design tokens, and preparing output for development across web and mobile platforms.