specgen-react-mui

Generate React SPA specifications from CLAUDE.md, PRD.md, and MODEL.md.

3|Updated Mar 15, 2026
One-click install
npx skills add https://github.com/rashidee/co2-skills --skill specgen-react-mui
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: specgen-react-mui
Source: https://github.com/rashidee/co2-skills/tree/main/skills/specgen-react-mui
Command: npx skills add https://github.com/rashidee/co2-skills --skill specgen-react-mui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Specification Generator automates the creation of complete, structured frontend architecture docs for React + MUI apps, turning high-level ideas into a codified blueprint ready for implementation.

Core Features & Use Cases

  • Generates a full SPECIFICATION.md and per-module SPEC.md from CLAUDE.md, PRD.md, MODEL.md, and MOCKUP.html.
  • Produces traceable versioned artifacts with module mappings, API surfaces, schemas, routes, and design tokens.
  • Supports optional script, reference, and asset resources to enrich the specification pipeline.

Quick Start

Generate a complete specification for a new React + MUI project by providing the application name and version.

Frequently Asked Questions about specgen-react-mui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate React frontend architecture specifications from markdown files?

To generate React frontend architecture specifications, this Skill automatically reads CLAUDE.md, PRD.md, and MODEL.md to produce a complete SPECIFICATION.md and per-module SPEC.md files with typed TS definitions and routing patterns.

Can I create per-module React specifications with API surfaces and design tokens?

Yes, you can create per-module React specifications with API surfaces and design tokens. The generator outputs individual SPEC.md files containing real module data, schemas, and design tokens for modular frontend architectures.

What's the best way to scaffold a React SPA using MUI with version-gated traceability?

The best way to scaffold a React SPA using MUI with version-gated traceability is to generate a codified blueprint from your PRD and mockup files, producing structured documentation ready for implementation.

Does this specification generator support optional modules and external reference resources?

Yes, the specification generator supports optional modules and external reference resources. It can enrich the specification pipeline by incorporating optional scripts, references, and asset resources alongside the core input files.

What input files do I need to provide to auto-create React MUI project specifications?

To auto-create React MUI project specifications, you need to provide CLAUDE.md, PRD.md, and MODEL.md files. You can also optionally provide MOCKUP.html to further enrich the generated architecture documentation.

Why are my React frontend documentation specs missing typed TS definitions and routing patterns?

React frontend documentation specs missing typed TS definitions and routing patterns often lack a structured generation process. Automating spec creation from PRD and model files ensures consistent API surfaces, schemas, and routing outputs.