skills.rest
Heyvhuang
HeyvhuangCOMMUNITY
Explore all skills by this author →
GitHub

tool-design-style-selector

Scan repository documentation and generate a deployable design-system.md from 30 presets.

339|58|Updated Jan 10, 2026
Search Tags:#workflow#deployment#ui-ux#design-system#presets#design-tokens#scan-intent
One-click install
npx skills add https://github.com/Heyvhuang/ship-faster --skill tool-design-style-selector
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tool-design-style-selector
Source: https://github.com/Heyvhuang/ship-faster/tree/main/skills/tool-design-style-selector
Command: npx skills add https://github.com/Heyvhuang/ship-faster --skill tool-design-style-selector

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams quickly standardize and unify a project's visual direction by generating or preserving a design-system.md file. It analyzes repository documentation to identify intent and outputs a ready-to-deploy design system that aligns typography, tokens, and layout constraints with one of 30 presets or the project's existing style.

Core Features & Use Cases

  • Scan project documentation (README, docs, code comments) to identify current visual direction and constraints.
  • Generate a design-system.md at project root that either preserves the current style or selects from presets (30 options) to unify UI across the codebase.
  • Deploy and reference the design system in subsequent UI work, enabling consistent tokens, typography, spacing, and components.

Quick Start

Run the skill to scan a repo and generate design-system.md. Then review and run deployment steps to apply the chosen style.

Frequently Asked Questions about tool-design-style-selector

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a design system from existing repository documentation?▼

To generate a design system, this tool scans your repository documentation to identify visual intent and outputs a deployable design-system.md file at the project root. It enforces a scan, intent, gate, and deploy workflow to standardize UI elements.

What is the best way to unify a project's visual direction and UI tokens?▼

The best way to unify visual direction is by applying one of 30 design presets or preserving the existing style. This generates a cohesive design system that aligns typography, layout constraints, and UI tokens across the codebase.

Can I preserve my existing UI style when generating a design-system.md file?▼

Yes, you can preserve your existing UI style. The tool scans repository documentation to identify your current visual direction and constraints, then generates a design-system.md file that maintains your established design tokens and typography.

How does the scan intent gate deploy workflow handle UI/UX planning?▼

The scan intent gate deploy workflow handles UI/UX planning by enforcing explicit steps during deployment. It includes planning for design tokens, typography, and layout constraints to ensure a cohesive and deployable design system.

Do I need specific dependencies to apply design presets to my codebase?▼

No specific dependencies are required to apply design presets. The tool operates independently to analyze repository documentation and generate a unified design-system.md file ready for deployment in your UI workflow.

Related Skills

Explore More Design & Creative Skills→
constellizeconstellize
1

achieve-documentation-completeness

Generate READMEs, WHY-based code comments, API docs, and decision records.

Official
Advanced
yxc023yxc023

frontend-design

Align frontend interfaces with design tokens, typography, color, and accessibility constraints.

Community
Advanced
NoobyGainsNoobyGains
78

design-integration

Detect a project's design system and enforce its conventions for new UI components.

Community
Advanced
SaltFishGCSaltFishGC

stitch-design-taste

Generate a Stitch DESIGN.md from a project brief and visual direction.

Community
Advanced