Blog
Notes from Huekit on design tokens and Figma variables
Articles from the Huekit team on Figma variables, design tokens and light/dark theming.
Accessible color palette for light and dark mode in Figma
Build an accessible color palette that meets WCAG AA in light and dark mode: the contrast ratios, the color pairs to test, and the Figma tools that check or adjust them.
Best Figma plugins to generate a design system (2026 data)
Nine Figma design system generator plugins compared on users, last update, variables, Light/Dark modes, semantic tokens, components and pricing, as of October 2026.
Catppuccin, Dracula and Tokyo Night in Figma: turn an editor theme into variables
Map Catppuccin, Dracula, Tokyo Night or One Dark onto Figma variables with Light and Dark modes: which flavor goes where, which roles to create, and which pairs fail contrast.
Design System Generator and Atomic alternatives for Figma (2026)
Design System Generator and Atomic haven't shipped a described change since 2024. What they do, what a token-first generator adds, and how to move an existing file over.
How to export Figma variables to Tailwind (v4 @theme or v3 config)
Three ways to export Figma variables to Tailwind: native JSON export plus a build step, an export plugin, or a generator with export built in. With v4 CSS for light and dark.
How to create a design system in Figma from scratch (startup size)
Build a small design system in Figma from scratch: color variables, text styles, spacing and radius, ten core components, a docs page and a library, with plan limits noted.
How to set up variable modes in Figma: collections, aliases and theme switching
A hands-on setup for Figma variable modes: which collection gets the modes, aliasing in each column, switching frames and pages, and what Figma's plan limits mean.
Figma variables on the free plan: what works without modes
On Figma's free Starter plan you can create variables, aliases and scopes, but not a second mode or a shared library. What works, the workarounds, and when to upgrade.
Figma variables vs Tokens Studio in 2026: which to use
Figma variables vs Tokens Studio, updated for 2026: token types, math, composite tokens, modes and themes, Git sync, import and export, plan limits and pricing.
Figr Identity alternatives: generate a design system inside Figma (2026)
Figr Identity's plugin now points users to the Figr AI web app. Here are the plugin-native alternatives for generating tokens, light and dark modes and components in Figma.
Free Tokens Studio alternatives in 2026: manage tokens or generate them?
Looking for a free Tokens Studio alternative? Compare native Figma variables, export plugins and system generators, and see when Tokens Studio is still the right call.
Primitive vs semantic tokens: the difference, with examples
Primitive tokens store raw values; semantic tokens name what a value is for and point to a primitive. Examples for color, spacing and type in Figma and Tailwind.