Need Vue 3 support? Checkout the Vue Formulate successor FormKit.
😎 Developer happiness
Forms are everywhere, yet surprisingly tedious to author — well, not anymore. Vue Formulate provides a powerful and flexible API to developers that makes complex form creation a breeze.
☝️ A single input element
With Vue Formulate you don't need to remember the names of a dozen components — all form elements are created with a single component. Easy!
💪 Grouped fields
Vue Formulate ships with repeatable field groups out of the box. Create complex UIs such as multi-person booking forms with ease.
🎯 Built-in validation
Ridiculously easy validation out-of-the-box to handle 95% of use-cases. Help text, validation rules, and validation messages are simple props. Need more? You can add custom validations too.
🔌 Plugin system
Extend Vue Formulate's functionality or reuse custom inputs, validation rules, and messages across projects by tapping into the plugin system. Make your plugin open source to share with others!
✨ Form Generation
Generate an entire form from JSON. Vue Formulate includes a schema to allow you to render complex forms from JSON with groups, wrappers, and custom components.
🎨 Styling Control
With provided class props you can add your own set of style classes globally or on a case-by-case basis. Tailwind? No problem. Bootstrap? You're covered. Roll your own? Right on, it’s supported.
🔍 Scoped Slots
Need even more control over your form’s markup? Vue Formulate ships with full scoped slots support so that you can globally or selectively provide your own markup.
🌐 Internationalization
Thanks to the wonderfully collaborative Vue community, Vue Formulate ships with support for over a dozen languages which are selectively importable to keep bundle size light.
# Live Code Examples
# Form validation
Vue Formulate includes 20 rules and support for defining your own.
# Single-element inputs
Try changing type="radio"
to checkbox
or select
in this demo.
# Well-considered file inputs
File inputs done well, right out of the box.
# Model an entire form in one object
Effortlessly ensure all fields have validated and even v-model
field values
to a single object.
# Quickly implement complex repeatable fields
Add grouped and repeatable fields without the complexity.