Layout Builder Expansion & Signature Input – Shadcn UI Multi Form v1.5.0

#opensource #nextjs #shadcnui #buildinpublic

Building tools in public has been one of the most rewarding parts of my developer journey. Over the past months, I’ve been working on Shadcn UI Multi Form, an open-source form builder focused on creating structured, modern multi-step forms using shadcn/ui.

Today I’m releasing version 1.5.0, which introduces new layout capabilities, a signature input component, and several internal improvements to the builder architecture.

This update is a step toward making the project more flexible, more structured, and easier to extend as the builder continues to grow.

What is Shadcn UI Multi Form?

Shadcn UI Multi Form is an open-source form builder designed to help developers create structured multi-step forms with a modern UI and flexible configuration.

The goal of the project is to provide:

A clean and intuitive builder experience
Flexible layout composition
Extendable input components
Structured code generation

Instead of manually wiring every field and layout, the builder allows developers to visually compose forms while keeping the generated code maintainable.

What’s new in v1.5.0

This release focuses on improving form structure and layout composition, while introducing a new input component that many real-world forms require.

New Layout Elements

Two new layout elements are now available in the builder:

Two Columns

This element allows developers to organize form inputs into two columns, making it easier to create more structured and readable forms.

This is particularly useful for:

address sections
grouped inputs
compact form layouts

Separator

The new Separator element helps divide form sections visually, improving readability and overall UX.

Instead of long forms with no visual hierarchy, you can now structure forms more clearly.

Signature Input

One of the most exciting additions in this release is the Signature Input component.

This component allows users to capture signatures directly inside the form using a canvas-based interface.

Features include:

Canvas-based signature capture
Configurable pen color
Configurable background
Clean integration with the form builder

Signature inputs are often required for:

agreements
consent forms
onboarding flows
internal tools

Now they can be easily added directly through the builder.

Dedicated Documentation

This release also introduces a dedicated documentation page for the Signature input within the Components section.

The goal is to make it easier for developers to understand how to use and configure the component without digging through the source code.

Builder Improvements

In addition to new features, this version also improves the internal behavior of the builder.

Layout-aware rendering

The builder now uses a shared render plan that allows layouts and inputs to work together more consistently.

This improves:

code generation
layout behavior
overall maintainability

UX refinements

Several improvements were made to the builder interface:

better layout assignment behavior
improved element selection
clearer highlighting when inserting new elements

These changes make the builder feel more predictable and easier to use.

Bug Fixes

This release also fixes several issues related to element insertion and layout references.

Previously, some selection and layout reference issues could occur when inserting new elements into complex form structures. These behaviors have now been corrected.

Building in Public

One of the most interesting parts of working on this project has been building it in public.

Sharing progress, metrics, experiments, and updates has helped the project grow organically and connect with other developers who are interested in building better tools.

Projects like this evolve over time, and Shadcn UI Multi Form is still far from finished. There are many more ideas and improvements planned as the builder continues to mature.