awesome-design-skills  by bergside

Design skill files for AI agentic tools

Created 2 months ago
859 stars

Top 41.4% on SourcePulse

GitHubView on GitHub
Project Summary

Summary

This repository curates a registry of "design skills" for AI agentic tools, addressing the challenge of maintaining design system consistency in AI-generated code. It targets developers and AI engineers using tools like Claude Code, Cursor, and Codex, providing structured guidelines that enable AI agents to produce UIs adhering to specific brand identities, style foundations, accessibility standards, and quality gates, thereby streamlining the integration of design systems into AI-driven development workflows.

How It Works

The core concept is the "Design Skill," a structured folder containing two key files: SKILL.md and DESIGN.md. SKILL.md serves as the machine-readable instruction set for AI agents, detailing brand philosophy, style foundations (typography, color, spacing), component rules, accessibility constraints (WCAG 2.2 AA), writing tone, and quality gates. DESIGN.md acts as a human-readable companion, outlining design rationale, overview, and maintenance notes. The TypeUI CLI (npx typeui.sh) facilitates pulling these SKILL.md files directly into AI tool configurations, enabling agents to reference and apply the specified design principles during code generation.

Quick Start & Requirements

  • Primary install/run command: npx typeui.sh pull <slug> (e.g., npx typeui.sh pull glassmorphism).
  • Prerequisites: Node.js and npm (required for npx).
  • Links: Browse skills at typeui.sh/design-skills.

Highlighted Details

  • Comprehensive SKILL.md structure covering brand, style, components, accessibility, tone, and quality gates.
  • Interactive CLI commands (list, generate) for browsing, pulling, and creating custom skills.
  • Provider targeting (-p cursor,claude) and dry-run previews (--dry-run).
  • Registry structure includes index.json for fast CLI lookups.

Maintenance & Community

  • Maintained by Bergside and powered by TypeUI.
  • No specific community channels (e.g., Discord, Slack) are listed in the README.

Licensing & Compatibility

  • License: MIT.
  • Compatibility: The MIT license permits broad use, including integration into commercial and closed-source projects.

Limitations & Caveats

The system relies on the TypeUI CLI for functionality. DESIGN.md files are not automatically integrated into the user's project, serving primarily as reference documentation within the registry. The effectiveness of generated code is contingent on the AI agent's interpretation of the SKILL.md instructions.

Health Check
Last Commit

1 day ago

Responsiveness

Inactive

Pull Requests (30d)
2
Issues (30d)
1
Star History
745 stars in the last 30 days

Explore Similar Projects

Feedback? Help us improve.