LibreUIUX-Claude-Code

LibreUIUX Claude Code

Complete UI/UX system for Claude Code -- 71 plugins, 152 agents, 76 commands, 74 skills, 3 hooks

---

Skills, Agents, Commands, and Workflows for Modern UI/UX Development with Claude Code

Stop getting the same outdated, Bootstrap-era designs. This repository provides a comprehensive, layered approach to dramatically improve the UI/UX components Claude Code generates for your projects.

---

The New Programming Paradigm

In December 2025, Andrej Karpathy observed that programming is being "dramatically refactored":

"I've never felt this much behind as a programmer. The profession is being dramatically refactored."

"New vocabulary: agents, subagents, their prompts, contexts, memory, modes, permissions, tools, plugins, skills, hooks, MCP, LSP, slash commands, workflows, IDE integrations..."

He described Claude Code as "the first convincing demonstration of what an LLM Agent looks like" - a "little spirit/ghost that lives on your computer."

LibreUIUX provides the skills, agents, commands, and workflows for this new paradigm - focused on UI/UX development.

Where LibreUIUX Fits

New Stack Component	LibreUIUX Provides
Skills	74 specialized skills (accessibility, animation, design systems, etc.)
Agents	152 agent definitions across the plugins (93 distinct agents; shared ones such as code-reviewer ship in several plugins)
Commands	76 slash commands across the plugins (65 distinct)
Plugins	71 installable plugins (frontend, accessibility, design mastery, etc.)
Hooks	3 optional hooks in libreuiux-hooks (stack context, secrets-file confirmation, accessibility hints)
Workflows	Beginner to advanced learning paths

This isn't just a prompt library. It's infrastructure for the new way we build software with AI.

---

What's Included

LibreUIUX-Claude-Code/
├── 71 Plugins         # Installable from the libreuiux marketplace
├── 152 Agents         # Task-specialized AI personas (93 distinct)
├── 76 Commands        # Slash commands for Claude Code (65 distinct)
├── 74 Skills          # Reusable capability modules
├── 3 Hooks            # Optional, in the libreuiux-hooks plugin
├── 3 Skill Levels     # Beginner → Intermediate → Advanced
└── Templates          # Ready-to-use configurations

Plugin Categories

Category	Plugins	Description
Frontend & UI	design-mastery, frontend-mobile-development, accessibility-compliance	Core UI/UX development
Backend Integration	backend-development, api-scaffolding, database-design	Full-stack patterns
Quality & Testing	unit-testing, tdd-workflows, code-review-ai	Ensure production quality
DevOps & Deploy	cicd-automation, deployment-strategies, kubernetes-operations	Ship with confidence
Specialized	game-development, blockchain-web3, machine-learning-ops	Domain expertise

Skills vs Commands vs Agents

Component	When to Use	Example
Skills	Need domain knowledge applied to a task	api-design-principles - teaches REST best practices
Commands	Quick, repeatable actions	/ui-critique - get instant design feedback
Agents	Complex, multi-step work requiring expertise	frontend-developer - builds complete components

---

Quick Start

Install from Claude Code

/plugin marketplace add HermeticOrmus/LibreUIUX-Claude-Code
/plugin install design-mastery@libreuiux

Install any other plugin the same way (/plugin install accessibility-compliance@libreuiux), or browse them all with /plugin. The same thing from a terminal:

claude plugin marketplace add HermeticOrmus/LibreUIUX-Claude-Code
claude plugin install design-mastery@libreuiux

From a clone, ./setup.sh installs every plugin through the Claude Code CLI (./setup.sh --list to see them, --only design-mastery,accessibility-compliance for a subset, --scope project for one project, --uninstall to remove them). The optional hooks are one more plugin: /plugin install libreuiux-hooks@libreuiux. Restart Claude Code after installing.

To drop a LibreUIUX CLAUDE.md template and config into a project instead, run ./bootstrap.sh from inside that project (this was setup.sh before 2.0.0).

Install in Grok Build

Grok Build loads the same plugin folders. Add the marketplace and install a plugin from a terminal:

grok plugin marketplace add HermeticOrmus/LibreUIUX-Claude-Code
grok plugin install design-mastery@LibreUIUX-Claude-Code

Or install one plugin straight from its folder, with no marketplace:

grok plugin install HermeticOrmus/LibreUIUX-Claude-Code#plugins/design-mastery

From a clone, ./setup.sh --grok installs every plugin through the grok CLI; --only, --list, and --uninstall work the same way. Grok Build uninstalls plugins by name only, and 66 plugin names here are also in claude-code-game-development (both packs take them from wshobson/agents), as is design-mastery in design-mastery-claude-code. If you install more than one of these packs, remove one with ./setup.sh --grok --uninstall rather than grok plugin uninstall <name>, which can take the other pack's copy. The libreuiux-hooks plugin uses a hook format Grok Build supports, but it has not been verified in a live Grok session yet.

Migrating from 1.x

Version 2.0.0 renames the marketplace from claude-code-workflows to libreuiux. The old name is also the name of wshobson/agents, so anyone with that marketplace installed could not add this one. The plugins keep their names.

1. Run /plugin marketplace list (or `claude plugin marke