Best Figma Design Tokens Alternatives - 2024 | Product Hunt (2024)

A collaborative design tool for creating user interfaces, mobile apps, and websites with a wide range of features, including vector editing tools, prototyping, and version control, all in a cloud-based platform.

Specify is a flexible and powerful tool designed to streamline the creation of Design Token processes, customizing them to fit the unique needs of your Design System.

This plugin allows you to effortlessly pull text and images from an Airtable database and inject them straight into your Figma components. Build a single component, and map the Airtable data fields to the right layers and choose your layout. It's that easy!

Map Maker allows you to make a customized map blazing fast with no configuration! It's Easy to Use, and Fully Customizable!

Design tokens are the smallest parts of your design: colors, typography, spacing, etc. With them, you can make consistent experiences across different parts of your website and app and even across projects.

Export Figma styles and custom design tokens to a style dictionary ready json or sync to github. ———— ✅ Actively developed ✅ Compatible with Amazon Style Dictionary ✅ Sync tokens with github / dev server ✅ Support for Figma Styles ✅ Support for custom tokens

Super Tidy renames your frames and reorders them in the layers list by their position in the canvas. It also replicates the Figma Tidy feature so you can run it all at once: Rename, Reorder and Tidy.

Synchronize your design tokens from Figma with a project that uses Ant Design of React. The tool is built on top of the Figma Tokens plugin and integrates with popular version control systems such as GitHub, GitLab, and Azure DevOps.

Want to try out this fancy new font in your Figma designs? Or lost control of your fonts? Font Replacer gives you an overview of the font families and styles that you used all in your designs. Simply pick the old font and replace it with the new font. Done.

Content Buddy searches for text content in your selection and populates a list with each unique text content so you can set a replacement text in all the nodes. Content Buddy works in instances, components, frames and groups.

Contrast makes it easy to check the contrast ratios of colors as you work in Figma. Select a layer and Contrast will immediately serve up the contrast ratio along with passing and failing levels from the WCAG. Works with images, gradients, and solids.

HSL color adjustment plugin for Figma. Allows you to tweak hue, saturation and lightness values of multiple selected objects at once. Comes very handy when you're in need of intense color job.

- Experiment with style-dictionary in your browser - Live preview window - Mobile - Desktop view - Share URL to share project - Open source - No signup / No login 👉 https://www.style-dictionary-play.dev

Effortlessly link your text and image layers with 130+ properties across 20+ unique categories. Generate data for random cities, colors, countries, crypto, careers, companies, credit cards. And those are just the categories that start with a C!

I’ll just use the default shadow — Said no one ever. Stunt & flex with these drop shadows instead, or tweak them to your liking. Just select a layer, pick a shadow size and your next Dribbble post will be a guaranteed success.

This API wraps the Tropos engine. The Tropos engine is powering the Stratos Tokens App* by Team Sketch2React Extract your Design Tokens from your Figma document as json data and use it for e.g: - MaterialUI Theming - CSS-in-JS - input for Style Dictionary