genai-web-dev
v1.0.25
Published
A CLI tool to generate a React landing page with styling and layout guidelines
Downloads
424
Maintainers
Readme
GenAI Web Dev
Description
A CLI tool that generates a complete React landing page setup with Tailwind CSS styling and SVG illustrations.
Installation
# Using npx (recommended)
npx genai-web-dev
# Or install globally
npm install -g genai-web-dev
Usage
genai-web-dev [options]
Options:
-c, --color <scheme> color scheme (blue, green, purple, orange, rose) (default: "blue")
-h, --help display help for command
-V, --version output the version number
Color Schemes
Available color schemes:
- Blue (#0061FF): Modern and professional
- Green (#00AB55): Fresh and natural
- Purple (#7C3AED): Creative and bold
- Orange (#EA580C): Energetic and warm
- Rose (#E11D48): Vibrant and passionate
Generated Structure
your-project/
└── GenAIWebDev/
├── unstyledComponents/
│ ├── LandingPage.js
│ ├── Header.js
│ ├── Footer.js
│ └── Table.js
├── styling-guide.md
├── LandingPageInstructions.md
├── HeaderInstructions.md
├── FooterInstructions.md
├── construction-prompts.md
└── Table.md
Generated Files
- Components: Ready-to-use React components with Tailwind CSS
- Styling Guide: Comprehensive design system documentation
- Instructions: Detailed component-specific guidelines
- Construction Prompts: Step-by-step component building instructions
Requirements
- Node.js >= 14.0.0
- React project with Tailwind CSS installed
Contributing
Contributions are welcome! Please read our contributing guidelines before submitting a pull request.
License
MIT © Stephan Smuts