StyleForge
Import TailwindCSS, Baseui, Shadcn an CossUI. Generates Variables, Styles & complete Typography
Plugin Preview
About this plugin
StyleForge instantly imports the latest design tokens from Tailwind CSS v4, Shadcn UI, BaseUI, Coss UI and other libraries directly into your Figma files as Variables and Styles.
⚡️ Always Up-to-Date Fetches the official Tailwind v4 tokens live from GitHub. No outdated JSON files, no copy-pasting.
🎨 Automatically maps semantic colors (like primary, muted, accent) to their primitive values and handles Light/Dark mode switching for you.
🔡 Advanced Typography Matrix Most plugins just give you a font size. StyleForge generates a complete Size × Weight matrix.
Key Features:
- One-Click Import: Select your library and go.
- Variables: Colors, Spacing, Radius, Opacity, and more.
- Styles: Text Styles (with weights), Shadows, and Blurs.
Supported Libraries:
- Tailwind CSS v4
- Shadcn UI
- Base UI
- Coss.com
Open source and built for modern design workflows. Give it a try!
Plugin Details
| Version | 3 |
|---|---|
| Created | February 19, 2026 |
| Last Updated | February 20, 2026 |
| Category | Import & export plugins |
| Creator | Vahid Lenjanzadeh |
| Stats | 9 installs, 6 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/index.html
- main:dist/code.js
- Document Access:dynamic-page
- Network Access:
Fetches design token source files from public GitHub repositories.
- Editor Types:figma
- Allowed Domains:
- https://raw.githubusercontent.com
More Like This
Discover other plugins in the Import & export plugins category.
html.to.design — by ‹div›RIOTS — Import websites to Figma designs (web,html,css)
Convert any website into fully editable Figma designs
Anima - Figma to Code React, HTML, CSS, Tailwind, MUI (DevMode Inspect React / HTML / Vue / CSS)
Anima - AI Powered Design to code
Figma to HTML
Convert Figma design to HTML