FigTok is a free plugin that converts Figma design tokens into CSS, JSON, and more. Perfect for designers and developers looking for visual consistency and fast delivery. Customize prefixes, export instantly, and copy with one click. Simple, fast, and productive.

Features

• Export Design Tokens: Convert Figma variables into CSS variables, JSON tokens, and a visual color palette.
• Customization: Easily configure options like custom prefixes for your variables.
• Filtering: Include or exclude Figma collections to organize your output.
• Instant Copy: Copy the generated code to your clipboard with a single click.
• Component Library: Includes a set of reusable components built with React and documented with Storybook.

Resources

• Figma Community - Figma plugin page.

Requirements

• Node.js: v18.0 or later.
• npm or yarn: For managing project dependencies.
• Figma: A Figma account to use the plugin.

About Me

• Twitter: @daguigonz
• Newsletters: aguirredaniels.com