Help us improve
Share bugs, ideas, or general feedback.
Share bugs, ideas, or general feedback.
Share bugs, ideas, or general feedback.
By markus41
Generate and manage frontend design systems with 263+ design styles, multi-tenant Keycloak theming, and accessible React components. Automate design token generation, style conversion, and accessibility audits for consistent UI across tenants.
npx claudepluginhub markus41/claude --plugin frontend-design-systemAudit UI for design style consistency and accessibility
Generate styled UI components with design system consistency
Convert CSS styles between different formats (CSS, Tailwind, styled-components)
Generate and deploy Keycloak theme files with FreeMarker templates
Generate color palettes from design style characteristics
Audit and fix accessibility issues in components and themes
Design and generate accessible React components with consistent styling
Strategic design decisions, style selection, and design system architecture
Implement responsive layouts and mobile-first design patterns
Implements selected design styles into production CSS/Tailwind/styled-components code
> Patterns from "Agentic Design Patterns" (Gulli & Sauco, 2025) applied to design token management, component scaffolding, multi-tenant theming, and accessibility-compliant UI generation.
UI component patterns with style-specific implementations and accessibility
Generate CSS, Tailwind, and styled-components code from design style selections
Access 263+ design styles with AI-optimized prompt keywords for frontend development
Multi-tenant Keycloak authentication theming with realm-specific design systems
Modifies files
Hook triggers on file write and edit operations
Uses power tools
Uses Bash, Write, or Edit tools
Share bugs, ideas, or general feedback.
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge.
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge.
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
Frontend design skill for UI/UX implementation
Use this agent when creating user interfaces, designing components, building design systems, or improving visual aesthetics. This agent specializes in creating beautiful, functional interfaces that can be implemented quickly within 6-day sprints. Examples:\n\n<example>\nContext: Starting a new app or feature design
Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns
Creates comprehensive design systems with typography, colors, components, and documentation for consistent UI development. Use when establishing design standards, building component libraries, or ensuring cross-team consistency.
Comprehensive Material UI (MUI) expert plugin — 26 skills, 14 commands, 7 agents covering theming, CSS variables, Pigment CSS, components, sx/styled, slots API, MUI X (DataGrid, DatePickers, Charts, TreeView), accessibility, performance, SSR/Next.js, animations, virtualization, forms, white-label/multi-tenant, headless (MUI Base), Joy UI, i18n/RTL, testing, migration, entity-driven CRUD, ecosystem integrations, and 200+ creative widget patterns.
Advanced frontend design plugin with interactive wizard, trend research, moodboard creation, color/typography selection, and browser-based inspiration analysis
Professional-grade multi-LLM agent coordination with comprehensive registry system, mandatory orchestration protocol, and production-ready DevOps workflows. Portable and customizable for any project.
Streamline development on the-lobbi/keycloak-alpha with Keycloak management, service orchestration, and test generation
Genesis (Forerunner) - AI-Powered Executive Director Automation Platform. Analyze organizational responsibilities, score automation potential with 6-factor algorithm, generate LangGraph workflows, and deploy 11 specialized agents for trade associations and nonprofits.
Comprehensive .NET 10, Blazor, ASP.NET Core, C#, and Syncfusion expert plugin for building modern web apps, microservices, and cloud-native solutions
Enterprise development toolkit for teams - DevOps, code quality, integrations, workflow automation, documentation, and performance optimization across multi-cloud and full-stack platforms
Share bugs, ideas, or general feedback.
A plugin-based AI agent orchestration platform that combines a visual workflow builder with a deep Claude Code configuration system. Fourteen domain plugins extend the platform across cloud infrastructure, enterprise SaaS, home automation, and more. The root plugin (claude-orchestration v4.0.1) ships 137 agents, 55 skills, and 100+ slash commands that activate automatically through a registry-backed keyword system.
The frontend (@accos/frontend v1.0.0) is the control surface: a React 18 application where you design, visualize, and manage multi-agent workflows and the plugin marketplace.
┌─────────────────────────────────────────────────────────────────┐
│ Visual Workflow Builder │
│ ReactFlow canvas · Zustand state · WebSocket │
└────────────────────────┬────────────────────────────────────────┘
│
┌────────────────────────▼────────────────────────────────────────┐
│ Plugin System Core │
│ Discovery · Installation · Validation · Dependency resolution │
│ Health checking · Sandboxing · Federated registry │
└───────────┬────────────────────────────────┬────────────────────┘
│ │
┌───────────▼──────────┐ ┌────────────▼───────────────────┐
│ 14 Domain Plugins │ │ Agent Fleet │
│ jira-orchestrator │ │ 137 agents · 30+ categories │
│ tvs-microsoft-deploy│ │ 55 skills · 100+ commands │
│ home-assistant-arch │ │ Activated via registry index │
│ fastapi-backend │ └────────────────────────────────┘
│ ... and 10 more │
└───────────┬──────────┘
│
┌───────────▼──────────────────────────────────────────────────────┐
│ MCP Servers │
│ deploy-intelligence · lessons-learned · project-metrics │
│ code-quality-gate · workflow-bridge · perplexity · firecrawl │
└──────────────────────────────────────────────────────────────────┘
Task toolPrerequisites: Node.js 18+, pnpm
# Install dependencies
pnpm install
# Start development server
pnpm dev
# Opens at http://localhost:5173
# Build for production
pnpm build