Generate DESIGN.md design token specifications from codebases and Tailwind configurations.
npx skills add https://github.com/inho-team/qe-framework --skill qdesign
Please help me install this Agent Skill. Skill: Qdesign Source: https://github.com/inho-team/qe-framework/tree/main/skills/Qdesign Command: npx skills add https://github.com/inho-team/qe-framework --skill qdesign
Design teams and frontend projects often lack a single source of truth for tokens, typography, spacing, and guidelines, leading drift between design and implementation. This skill automates the creation and synchronization of DESIGN.md from live tokens and reference material.
Run the Qdesign skill to generate DESIGN.md from your project tokens and references.
High-intent search queries and answers about installing and using this skill.
To generate a design system specification from existing tokens, the Skill automatically scans your codebase and Tailwind configurations to extract typography, spacing, and color tokens, bootstrapping a complete canonical document. It uses live scanning to synchronize live theme configurations into a single source of truth.
You can extract design tokens from a Tailwind configuration file by running a live scan. The Skill parses your theme configurations to automatically identify and pull colors, typography, spacing, and motion tokens to bootstrap a complete tokenized specification document.
The best way to enforce OKLCH color tokens and dark-mode mappings is to use an automated validation skill that checks contrast requirements and cross-project consistency. It validates extracted tokens against design tooling to ensure coherent dark-mode mappings and color specifications.
Yes, you can bootstrap a design doc directly from code without manual token documentation. The Skill automatically extracts tokens from your live codebases, Tailwind theme configs, and design references to generate a complete DESIGN.md file as the single source of truth.
Frontend design drifts from original implementation guidelines when projects lack a single source of truth for tokens and typography. Automatically generating and synchronizing a canonical specification from live tokens and reference material prevents this drift and ensures cross-project consistency.
Yes, this design token validation approach works with existing Tailwind configs. The Skill aligns with design tooling validators to ensure token coherence across your Tailwind configurations and components, validating extracted tokens for cross-project consistency.
Pabloprogramador23Extract design tokens from CSS, Tailwind themes, and screenshots into a design-system reference.
JamesFincherValidate and export DESIGN.md token specs to Tailwind or W3C DTCG JSON.
artivillaAutomate Tailwind v4 theming with CSS-first @theme directives and OKLCH tokens.
arbisoftGenerate and audit design tokens with JSON and CSS outputs.
