Hi Product Hunt! I'm Evgenii, a frontend developer & designer. I wrote tailwind-dictionary for my own design system, pbstyles. Its colors, sizes and fonts are described as tokens, and I wanted the Tailwind theme to be built from them instead of maintained by hand. Now the theme builds with one command, and since version 2.6 the package also reads variables exported from Figma. What it does: – reads Figma's native variables export, Tokens Studio and Style Dictionary tokens; – builds a theme for Tailwind CSS 4 or 3; – makes light, dark and any other themes that switch with a data-theme attribute; – is configured with one config.json, no build script. The package page has a live example: tokens, the theme built from them, and a block where you can switch the theme. If you need help with a Figma export, themes or style builds — get in touch: Telegram @prosazhin or prosazhin@gmail.com. More of my work is at prosazhin.dev.

tailwind-dictionary

A Tailwind theme from design tokens, in one command

A Tailwind theme from design tokens, in one command