Skip to main content

​
JSON Forms - More Forms. Less Code

Complex forms in the blink of an eye JSON Forms eliminates the tedious task of writing fully-featured forms by hand by leveraging the capabilities of JSON, JSON Schema and Javascript. Generate forms from your data models and focus on what matters: your application logic.

​
Why JSON Forms?

JSON Forms is a declarative framework for efficiently building complex forms with minimal effort. Instead of writing form markup by hand, you describe the structure of your data with JSON Schema and optionally customize the layout with UI Schema.

​
Key features

  • Framework Support: First-class bindings for React, Angular, and Vue
  • Declarative: Define forms using JSON Schema and UI Schema
  • Validation: Built-in validation powered by AJV
  • Customizable: Multiple renderer sets including Material Design, Vanilla HTML, and Vuetify
  • Extensible: Create custom renderers and controls for your specific needs
  • Type Safe: Full TypeScript support across all packages

​
Quick overview

JSON Forms uses two key concepts:
  1. JSON Schema - Describes the structure and validation rules of your data
  2. UI Schema - (Optional) Customizes the layout and appearance of the form
{
  "type": "object",
  "properties": {
    "name": {
      "type": "string",
      "minLength": 1
    },
    "email": {
      "type": "string",
      "format": "email"
    },
    "birthDate": {
      "type": "string",
      "format": "date"
    }
  },
  "required": ["name", "email"]
}
The UI Schema is optional. If you don’t provide one, JSON Forms will automatically generate a default layout based on your JSON Schema.

​
Get started

Quickstart

Build your first JSON Form in minutes with our step-by-step guide

Installation

Install JSON Forms for React, Angular, or Vue

Core concepts

Learn about schemas, renderers, and customization

API reference

Explore the complete API documentation

​
Architecture

JSON Forms is built with a modular architecture:
  • @jsonforms/core - Framework-agnostic core library with validation and utilities
  • Framework bindings - React, Angular, and Vue integrations
  • Renderer sets - Pre-built UI components for different design systems

​
Framework support

JSON Forms provides first-class support for the most popular frontend frameworks:
FrameworkPackageRenderer Sets
React@jsonforms/reactMaterial, Vanilla
Angular@jsonforms/angularMaterial
Vue 3@jsonforms/vueVanilla, Vuetify

​
Next steps

1

Try the quickstart

Follow our quickstart guide to build your first form in minutes
2

Choose your framework

Check the installation guide for framework-specific setup instructions
3

Explore examples

Browse the examples to see JSON Forms in action with different use cases
4

Customize

Learn how to create custom renderers for your specific requirements

​
Community and support

JSON Forms is developed by EclipseSource and the open source community.
When migrating from an older version of JSON Forms, please check the migration guide for breaking changes and upgrade instructions.

Build docs developers (and LLMs) love

Get started for freeTalk to us