Shadcn component so form taste better.

Describe fields, pages, and validation in one object. useFormedible renders the full form with shadcn/ui components and TanStack Form.

Zod validation
Multi-page flows
25+ field types
Component overrides
Visual builder
AI generation

pnpm dlx shadcn@latest add https://formedible.dev/r/formedible-core.json

Read the docs

Installation Guide Generator

Personalized setup instructions for your project stack and preferences

Installation Guide Generator

Usage

import { useFormedible } from '@formedible/ui/components/formedible/hooks/use-formedible';
import { z } from 'zod';

const schema = z.object({
  name: z.string().min(2),
  email: z.string().email(),
  guests: z.number().min(1).max(12),
});

const { Form } = useFormedible({
  schema,
  fields: [
    { name: 'name', type: 'text', label: 'Guest name' },
    { name: 'email', type: 'email', label: 'Email' },
    { name: 'guests', type: 'number', label: 'Party size' },
  ],
  formOptions: {
    defaultValues: { name: '', email: '', guests: 1 },
    onSubmit: async ({ value }) => {
      await saveReservation(value);
    },
  },
});

// <Form /> — that's it.

Getting started

Validation

Zod schemas, inline validators, async checks, cross-field rules. Errors surface next to the field that caused them.

Read API validation options

Multi-page

Pages, tabs, conditional routing, dynamic copy, and progress tracking. Declared as data on each field.

Read advanced docs

25+ field types

Text, select, date, switch, slider, file upload, combobox, rating, color picker, phone, location, and more.

Browse field docs

Component overrides

Swap any field renderer, wrapper, label, or error component. Full control without forking.

Read API docs

Persistence

Auto-save drafts to localStorage. Resume exactly where you left off.

Read persistence docs

Builder & AI

Drag fields in the visual builder or describe them in natural language. Both export the same typed field model.

Open builder docs

Conditional logic

Show, hide, or require fields based on other values. Declarative, no imperative glue.

Read logic docs

Get started

pnpm dlx shadcn@latest add https://formedible.dev/r/formedible-core.json

Read the docs View examples

Shadcn component so form taste better.

Installation Guide Generator

Installation Guide Generator

Project Setup

Get started