claude

ui-kit-generator

Interactive UI-Kit generator using Atomic Design principles (Atoms → Molecules → Organisms → Templates → Pages). Features intelligent planning agent, parallel component generation via subagents, and design system creation with automatic dependency resolution.

3 on GitHubby iButtersv1.2.0MITupdated 10 months ago
/

Plugin ui-kit-generator from marketplace claude-code-plugins in iButters/ClaudeCodePlugins. Commands read from the repo's manifest — 1 month ago.

What it installs

Skills (8)

  • atomic-design

    Atomic Design methodology for React component architecture. Use for structuring component libraries, organizing UI hierarchies, and creating scalable design systems. Triggers on requests for component organization, design system structure, UI hierarchy, or questions about Atoms/Molecules/Organisms/T

  • css-tokens

    Design tokens system using CSS Custom Properties for consistent styling. Use for creating color palettes, spacing scales, typography systems, and theming (dark/light mode). Triggers on requests for design tokens, CSS variables, theming, color systems, spacing scales, or consistent styling.

  • mobile-app-ux

    Mobile app UX/UI best practices for smartphone interfaces. Use for designing touch-friendly interfaces, mobile navigation patterns, gesture handling, and optimizing user experience on small screens. Triggers on requests for mobile UX, app design, touch interfaces, mobile patterns, or smartphone UI b

  • react-typescript

    Modern React 19 with TypeScript development. Use for creating React components, hooks, context providers, and applications with strict TypeScript typing. Triggers on requests for React components, functional components, hooks, state management, event handling, or TypeScript interfaces/types for Reac

  • react-web

    Modern React 19+ development with Server Components, Actions, hooks, TypeScript integration, and performance optimization. Use when building React web applications, implementing Server Components, using Actions for form handling, working with new hooks (use, useActionState, useOptimistic, useFormSta

  • responsive-design

    Responsive web design patterns for mobile-first development. Use for creating fluid layouts, breakpoint systems, responsive typography, flexible grids, and adaptive components. Triggers on requests for responsive layouts, mobile-first CSS, breakpoints, media queries, fluid design, or multi-device su

  • storybook

    Storybook 8 for React component documentation and testing. Use for creating stories, documenting components with Controls/Actions, visual testing, and MDX documentation. Triggers on requests for Storybook stories, component documentation, visual testing, or interactive component demos.

  • zustand-store

Subagents (1)

  • ui-prototype-creator

    Hans Wurst

View source on GitHub

More from iButters/ClaudeCodePlugins

All 6 plugins →

plugin-dev

claude

Comprehensive toolkit for developing Claude Code plugins with guidance on hooks, MCP integration, plugin structure, commands, agents, and skills

7 skills · 1 command · 3 agents

3

spec-driven-workflow

claude

Structured development workflow with requirements -> design -> tasks -> implementation using EARS notation

1 skill · 7 commands · 3 agents

3

llm-prompt-optimizer

claude

Comprehensive prompt engineering plugin for optimizing, analyzing, and creating prompts across multiple LLM models (Claude, GPT, Gemini)

1 skill · 3 commands · 3 agents

3

dotnet-development

claude

Expert guidance for .NET development with Domain-Driven Design, SOLID principles, and modern C# practices

1 skill

3

maui-blazor-development

claude

Expert guidance for .NET MAUI Blazor Hybrid development with cross-platform patterns, Blazor components, and native platform integration

1 skill

3

Similar plugins

example-skills

claude

Collection of example skills demonstrating various capabilities including skill creation, MCP building, visual design, algorithmic art, internal communications, web testing, artifact building, Slack GIFs, and theme styling

19 skills

anthropics/skills 193,780

pr-review-toolkit

claude

Comprehensive PR review agents specializing in comments, tests, error handling, type design, code quality, and code simplification

1 command · 6 agents

anthropics/claude-code 155,476

ui-ux-pro-max

claude

Professional UI/UX design intelligence for AI coding assistants. Includes searchable databases of styles, colors, typography, charts, and UX guidelines for React, Next.js, Astro, Vue, Nuxt.js, Nuxt UI, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, and Three.js.

7 skills

nextlevelbuilder/ui-ux-pro-max-skill 148,759

nextjs

claude

Official Next.js skills: adopt and optimize Cache Components, adopt Partial Prefetching, and verify runtime behavior against a running dev server.

6 skills

vercel/next.js 143,495

Taste Skill

claudecodex

tasteskill 2.5.1: professional company websites at the figma.com and x.ai level, with one section per screen, real photographs, real product UI, effects kept for tech and gaming pages, and a real-browser checker and finish gate.

1 skill

Leonxlnx/taste-skill 114,391

diagram-design

claudecodex

Editorial diagrams in your brand, as self-contained HTML and SVG. Architecture, flowcharts, sequence, state machines, ER and database schemas, timelines, swimlanes, org charts, Gantt, Wardley maps, user journeys, service blueprints, UML class, lifecycle phase maps, and charts from bar, line and scatter to Sankey, treemap and heatmap, plus many more. Redraws draw.io, Mermaid, Excalidraw and PlantUML files. Exports SVG and PNG.

1 skill · 7 commands

cathrynlavery/diagram-design 66,757

Maintain ui-kit-generator?

This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.

claude & codex plugins6 plugins