Back to skills
SKILL.md
Component Gen
ASecurityGenerate React/Vue/Svelte components from descriptions
- 651 stars
- 0 votes
- 0 copies
- 1 view
- Added February 10, 2026
Works with
Security analysis
100/100npx -y skills add sundial-org/awesome-openclaw-skills --skill component-gen --agent claude-codeAre you the author of Component Gen?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/sundial-org-component-gen)---
name: component-gen
description: Generate React/Vue/Svelte components from descriptions
---
# Component Generator
Describe what you want, get a production-ready component. Supports React, Vue, and Svelte.
## Quick Start
```bash
npx ai-component "A pricing card with monthly/yearly toggle"
```
## What It Does
- Generates full components from descriptions
- Supports React, Vue, and Svelte
- Includes TypeScript types
- Adds proper accessibility
- Includes Tailwind styling
## Usage Examples
```bash
# Generate React component
npx ai-component "user profile card with avatar"
# Specify framework
npx ai-component "dropdown menu" --framework vue
# With specific styling
npx ai-component "modal dialog" --css tailwind
```
## Output Includes
- Component file with proper structure
- TypeScript interfaces
- Default props
- Basic tests scaffold
- Storybook story (optional)
## Requirements
Node.js 18+. OPENAI_API_KEY required.
## License
MIT. Free forever.
---
**Built by LXGIC Studios**
- GitHub: [github.com/lxgicstudios/ai-component](https://github.com/lxgicstudios/ai-component)
- Twitter: [@lxgicstudios](https://x.com/lxgicstudios)
Attribution
Comments
Loading comments…