New: Fully typed React + Zod form components
Beautiful, accessible formsfor modern web apps
FormForge gives you production-ready form primitives powered by React Hook Form and Zod. Copy, paste, and ship faster.
Type-safe
End-to-end typings via Zod schemas and TS generics.
Accessible
ARIA-compliant with keyboard navigation.
Fast
Optimized with React Hook Form for minimal re-renders.
Integrations
Works with your favorite UI and validation tools.
Theming
Tailwind-first styling with accent controls.
DX focused
Copy-paste snippets and live previews built-in.
See it in action
Preview
import { zodResolver } from "@hookform/resolvers/zod";
import { useForm, FormProvider } from "react-hook-form";
import { z } from "zod";
import InputField from "@/components/ui/InputField";
const formSchema = z.object({
email: z.string().email({ message: "Invalid email address." }),
password: z.string().min(8, { message: "Password must be at least 8 characters." }),
});
export default function ExampleForm() {
const methods = useForm<z.infer<typeof formSchema>>({ resolver: zodResolver(formSchema) });
return (
<FormProvider {...methods}>
<form onSubmit={methods.handleSubmit(onSubmit)} className="space-y-4">
<InputField name="email" label="Email" type="email" placeholder="you@example.com" />
<InputField name="password" label="Password" type="password" placeholder="••••••••" />
<button type="submit" className="form-button form-button-primary">Submit</button>
</form>
</FormProvider>
);
}