Variable Syntax
Batch update variable syntax for web, Android, and iOS
Plugin Preview
About this plugin
Variable Syntax is a Figma plugin that simplifies the process of formatting design tokens and variables for different platforms. This tool allows you to convert variable names into various formats such as camelCase, PascalCase, snake_case, and kebab-case — in a circular manner, so you can easily switch between them. It supports web, Android, and iOS platforms, enabling quick and consistent syntax generation for each platform. Whether you're working with CSS variables for the web or adapting variables for mobile, this plugin helps streamline your design-to-development workflow.
Key Benefits:
- Save time by updating multiple variables in one click
- Keep variable syntax consistent across platforms
- Preview the changes live before applying
- Cross-Platform Support – Supports Web, Android, and iOS.
- Multiple Syntax Formats – camelCase, PascalCase, snake_case, kebab-case.
- User-Friendly Interface – Simple and intuitive controls.
- Design Token Management – Organize and format variables consistently.
- Platform-Specific Code Generation – Generate code for Web, Android, and iOS.
- Variable Collection Support – Format groups of variables in collections.
- Live Syntax Preview – See changes in real-time before applying.
- Undo/Redo – Track and revert changes easily.
- Batch Formatting – Format multiple variables at once.
- Efficient Workflow Integration – Streamlines the design-to-development process.
Plugin Details
Version | 1 |
---|---|
Created | August 19, 2025 |
Last Updated | August 19, 2025 |
Category | Software development |
Creator | Tom Barrett |
Stats | 0 installs, 0 likes |
Pricing | Free |
Technical Details
- API:1.0.0
- UI:ui.html
- main:code.js
- Document Access:dynamic-page
- Editor Types:figma
- Allowed Domains:
- none
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 - AI-Powered Figma to Code (React, Vue, Tailwind, & more)
Export designs to responsive code (React, HTML, Vue, Tailwind, etc) with AI
SkewDat
Skew any layer or group with all layers preserved to edit.