Introduction

Welcome to FormMorf - a powerful, enterprise-ready React form builder library with drag-and-drop functionality.

npm PackageGitHub

What is FormMorf?

FormMorf is a comprehensive React library that enables developers to build dynamic, interactive forms with a visual drag-and-drop interface. It combines powerful features with an intuitive API to make form building fast and enjoyable.

Key Features

  • ✓
    Drag & Drop Interface: Intuitive form building with @dnd-kit for smooth, accessible drag-and-drop interactions
  • ✓
    20+ Field Types: Rich set of form fields including text, number, date, file upload, rich text editor, and more
  • ✓
    Responsive Preview: See how your forms look on desktop, tablet, and mobile devices in real-time
  • ✓
    Comprehensive Validation: Built-in validators and support for custom validation rules
  • ✓
    TypeScript Support: Full type definitions for excellent IDE support and type safety
  • ✓
    Material-UI Integration: Beautiful, accessible components following Material Design

Tech Stack

Core

  • • React 18
  • • TypeScript
  • • Zustand (State Management)
  • • Immer (Immutable Updates)

UI & Interactions

  • • Material-UI v7
  • • @dnd-kit (Drag & Drop)
  • • Emotion (CSS-in-JS)

Use Cases

  • • Admin Panels: Create dynamic forms for data entry and management
  • • Survey Tools: Build customizable surveys and questionnaires
  • • Form Builders: Embed a form builder in your SaaS application
  • • Workflow Automation: Generate forms programmatically based on business logic
  • • CMS Systems: Enable content editors to create custom forms

Ready to get started?

Follow our installation guide to add FormMorf to your project

Installation Guide