form-gen
Generate form components with validation. Use when building forms.
Install via CLI (Recommended)
clawhub install openclaw/skills/skills/lxgicstudios/form-genForm Generator
Forms are tedious. Validation is worse. Describe what fields you need and get a complete form component with validation wired up.
One command. Zero config. Just works.
Quick Start
npx @lxgicstudios/ai-form "signup form with email, password, name"
What It Does
- Generates React form components
- Includes validation with react-hook-form + zod
- Handles error states and accessibility
- Supports TypeScript out of the box
Usage Examples
# Signup form
npx @lxgicstudios/ai-form "signup form with email, password, name"
# Checkout form with TypeScript
npx @lxgicstudios/ai-form "checkout form with address and payment" -t
# Contact form to file
npx @lxgicstudios/ai-form "contact form" -o ContactForm.tsx -t
Best Practices
- Use TypeScript - catch errors at compile time
- Show inline errors - don't wait until submit
- Add loading states - show progress during submission
- Test with keyboard - forms must be accessible
When to Use This
- Need a form fast without boilerplate
- Setting up validation patterns
- Prototyping with working forms
- Learning react-hook-form + zod
Part of the LXGIC Dev Toolkit
This is one of 110+ free developer tools built by LXGIC Studios. No paywalls, no sign-ups, no API keys on free tiers. Just tools that work.
Find more:
- GitHub: https://github.com/LXGIC-Studios
- Twitter: https://x.com/lxgicstudios
- Substack: https://lxgicstudios.substack.com
- Website: https://lxgic.dev
Requirements
No install needed. Just run with npx. Node.js 18+ recommended. Needs OPENAI_API_KEY environment variable.
npx @lxgicstudios/ai-form --help
How It Works
Takes your form description, determines the fields and their validation rules, then generates a complete React component using react-hook-form for state management and zod for validation schemas.
License
MIT. Free forever. Use it however you want.
Metadata
Not sure this is the right skill?
Describe what you want to build — we'll match you to the best skill from 16,000+ options.
Find the right skillPaste this into your clawhub.json to enable this plugin.
{
"plugins": {
"official-lxgicstudios-form-gen": {
"enabled": true,
"auto_update": true
}
}
}Related Skills
script-gen
Generate package.json scripts with AI. Use when setting up npm scripts.
email-template-gen
Generate responsive email templates. Use when building transactional emails.
branch-namer
Generate descriptive git branch names from plain English. Use when you need a branch name that follows conventions.
cloudflare-gen
Generate Cloudflare Workers configuration and code. Use when building on the edge.
adr-writer
Generate Architecture Decision Records with AI. Use when documenting technical decisions.