skills.rest
de6eling
de6elingCOMMUNITY
Explore all skills by this author →
GitHub

design-setup

Scan repositories to generate design-compose configuration files.

1|Updated Mar 31, 2026
Search Tags:#automation#workflow#setup#tokens#design-system#component-catalog
One-click install
npx skills add https://github.com/de6eling/ai-skills --skill design-setup-de6eling
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-setup
Source: https://github.com/de6eling/ai-skills/tree/main/.claude/skills/design-setup
Command: npx skills add https://github.com/de6eling/ai-skills --skill design-setup-de6eling

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

Configure design system enforcement for a repository. Run once to discover reusable UI units (components), named visual values (tokens), and composition patterns. Generates config for the design-compose skill. Works across web frameworks, Flutter, SwiftUI, and any component-based UI system. Re-run if the repository structure changes.

Core Features & Use Cases

  • Auto-discovers components, tokens, and composition rules; generates design-compose config.
  • Works across web frameworks, Flutter, SwiftUI, and any component-based UI system.
  • Re-runs automatically when repository structure changes to refresh mappings.

Quick Start

Run the /design-setup command to auto-detect your design system and generate the initial configuration.

Frequently Asked Questions about design-setup

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

FAQPage Schema
How do I auto-discover design tokens and components in a monorepo?▼

To auto-discover design tokens and components in a monorepo, run the setup command to scan your repository and generate a reusable design-system configuration. This process maps reusable UI units and named visual values into JSON artifacts.

Does design system setup work with Flutter and SwiftUI projects?▼

Design system setup works across web frameworks, Flutter, and SwiftUI. The scanning scripts analyze any component-based UI system to extract composition rules and generate framework-agnostic configuration files.

What is a component-map.json file used for in design system enforcement?▼

A component-map.json file catalogs discovered reusable UI units and composition rules within your repository. It serves as the generated configuration output required to enforce your design system across multi-framework projects.

When should I re-run design system configuration generation?▼

You should re-run design system configuration generation whenever your repository structure changes. Re-executing the setup command refreshes the component and token mappings to accurately reflect your updated codebase.

Do I need Python scripts to generate token-patterns.json files?▼

You need the included Python scripts and hooks to generate token-patterns.json files. These scripts perform the repository scanning, verification, and artifact generation required to map named visual values.

Related Skills

Explore More Design & Creative Skills→
lawve-ailawve-ai
630

eu-ai-act-report-oliver-schmidt-prietz

Scan repositories for SKILL.md frontmatter and generate standardized YAML metadata.

Official
Advanced
yutnayutna
2

ui-design-system

Align UI decisions with centralized design tokens, layout patterns, and component recipes.

Community
Advanced
alexandrbasisalexandrbasis
12

sync-public

Synchronize Claude Code configuration from a monorepo root to a public GitHub repository.

Community
Intermediate
phoenicisfphoenicisf

figma-generate-design

Build or update full-page Figma screens using published design system components and tokens.

Community
Advanced