Main Modules and Components of Leonxlnx/taste-skill: Complete Architecture Guide
The Leonxlnx/taste-skill repository consists of a modular ecosystem of design instruction files located in the skills/ directory, orchestrated by the skill.sh registry script and supported by research documentation and asset libraries.
The Leonxlnx/taste-skill project is an open-source collection of AI design workflows packaged as discrete, reusable modules. Each module lives as a SKILL.md file within a dedicated subdirectory, enabling developers to import specific design behaviors into AI-assisted coding environments via the npx skills CLI.
Skill Registry and CLI Integration
The skill.sh bash script serves as the central registry that maps short skill identifiers to their canonical instruction files. Located at the repository root, this script allows automated tooling to resolve skill names like taste-skill to their full paths (e.g., skills/taste-skill/SKILL.md).
# Source the helper to resolve a skill path
source ./skill.sh taste-skill
# Output: skills/taste-skill/SKILL.md
This registry enables the npx skills add command to discover and install specific design workflows from the repository without manual path configuration.
Core Design Skills
The repository maintains multiple generations of its primary design system to support different project requirements and AI agent capabilities.
Taste Skill v2 (Experimental)
Located at skills/taste-skill/SKILL.md, this is the flagship frontend design module. It implements a three-dial control system (design variance, motion intensity, and visual density) that processes briefs and emits production-ready React/Next.js code with strict adherence to accessibility and spacing standards.
Legacy Taste Skill v1
The skills/taste-skill-v1/SKILL.md file preserves the original implementation for projects with dependencies on its specific behavior patterns. This module remains available for backward compatibility while the v2 iteration handles new projects.
GPT-Optimized Variant
The skills/gpt-tasteskill/SKILL.md module provides a stricter instruction set specifically tuned for GPT/Codex agents. This variant increases layout variance and motion intensity defaults to leverage the architectural strengths of OpenAI's code generation models.
Specialized Workflow Skills
Beyond core frontend generation, the repository includes targeted modules for specific development workflows.
- Image-to-Code Skill (
skills/image-to-code-skill/SKILL.md): Generates reference images first, then analyzes them to produce final frontend implementations, bridging the gap between visual design and code. - Redesign Skill (
skills/redesign-skill/SKILL.md): Audits existing UI implementations and applies systematic corrections to layout, spacing, and styling without rewriting component logic. - Output Skill (
skills/output-skill/SKILL.md): Enforces completion guarantees by instructing agents to emit complete, runnable code rather than placeholder comments or ellipsis shortcuts.
Visual Language Skills
These modules define specific aesthetic systems that can be layered onto generated code.
- Soft Skill (
skills/soft-skill/SKILL.md): Produces calm, premium interfaces with reduced contrast ratios, increased whitespace, and refined typography selections. - Minimalist Skill (
skills/minimalist-skill/SKILL.md): Implements clean, Notion-/Linear-style aesthetics with restrained color palettes and structural simplicity. - Brutalist Skill (
skills/brutalist-skill/SKILL.md): Generates hard-edged, high-contrast industrial aesthetics with bold borders and maximalist typography. - Stitch Skill (
skills/stitch-skill/SKILL.md): Emits Google Stitch-compatible design rules and optionalDESIGN.mddocumentation for cross-platform design systems.
Image Generation Modules
For workflows requiring visual references before code implementation, the repository provides image-only generation skills.
- ImageGen Frontend Web (
skills/imagegen-frontend-web/SKILL.md): Produces reference compositions for hero sections, landing pages, and multi-section layouts at desktop resolutions. - ImageGen Frontend Mobile (
skills/imagegen-frontend-mobile/SKILL.md): Generates mobile-sized reference images optimized for responsive design workflows. - Brand Kit Skill (
skills/brandkit/SKILL.md): Creates comprehensive brand boards including logo directions, color palettes, typography systems, and application mockups.
Research and Supporting Infrastructure
The research/ directory contains README.md and supporting documents that detail the design philosophy, "laziness" research findings, bias correction methodologies, and architectural patterns that inform all skill modules. This theoretical foundation ensures consistent decision-making across the skill ecosystem.
Additional supporting components include:
assets/: Visual branding materials including the project logo and banner images.examples/: Sample screenshots and generated outputs displayed in the README.- Top-level project files:
README.md(installation and overview),CHANGELOG.md(version history including the v1-to-v2 transition), andLICENSE.
How to Install and Use the Modules
Install specific skills using the official CLI, which scans the skills/ folder structure automatically:
# Install the entire skill collection
npx skills add https://github.com/Leonxlnx/taste-skill
# Install a specific skill by its registry name
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
Each SKILL.md file contains the complete instruction set that AI agents consume to execute its specific workflow, making the modules portable across different coding environments without additional dependencies.
Summary
- The Leonxlnx/taste-skill architecture centers on discrete
SKILL.mdfiles stored in categorized subdirectories underskills/. - The
skill.shscript provides the mapping layer that connects short skill names to their canonical file paths for CLI integration. - The repository maintains parallel v1 and v2 design skills to support both legacy and experimental workflows.
- Specialized modules cover specific tasks including image-to-code conversion, UI redesign auditing, and brand kit generation.
- Visual language skills (Soft, Minimalist, Brutalist, Stitch) provide aesthetic constraints that modify output style without changing core functionality.
- The
research/directory houses the theoretical documentation that guides the design principles embedded in each skill.
Frequently Asked Questions
What is the Leonxlnx/taste-skill repository?
The Leonxlnx/taste-skill repository is a curated collection of markdown-based design instructions (called "skills") that guide AI coding agents in generating specific visual styles, layouts, and frontend implementations. Each skill is a self-contained module that can be installed via the npx skills CLI to add design capabilities to AI-assisted development workflows.
How do I install a specific module from the taste-skill collection?
You can install individual modules using the skill's registry name with the command npx skills add https://github.com/Leonxlnx/taste-skill --skill "skill-name". The skill.sh script at the repository root maps these short names to their corresponding SKILL.md files in the skills/ directory, allowing the CLI to locate and import the correct instruction set.
What is the difference between taste-skill v1 and v2?
Taste-skill v2 (skills/taste-skill/SKILL.md) represents the current experimental frontend skill with a three-dial control system for design variance, motion, and density, while v1 (skills/taste-skill-v1/SKILL.md) preserves the original implementation's exact behavior for projects with existing dependencies. The v2 module includes stricter React/Next.js patterns and enhanced accessibility constraints compared to the legacy version.
What content is stored in the research directory?
The research/README.md and associated files in the research/ directory document the underlying design philosophy, including research on AI "laziness" (tendency to cut corners), bias correction methodologies, and architectural patterns that inform how the skills constrain and guide AI agent outputs. This documentation provides the theoretical foundation for the practical instructions embedded in each SKILL.md file.
Have a question about this repo?
These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:
curl -s "https://instagit.com/install.md" Maintain an open-source project? Get it listed too →