Formwerk
banner
formwerk.dev
Formwerk
@formwerk.dev
The Vue.js 🖖 framework for building tailored, accessible, and high-quality forms 📋 with full control and flexibility 🎨
🚀 It took some time but Formwerk v0.11.0 now has multi-step forms!

✅ Linear/Non-linear flows
✅ Step-level validation
✅ Accessible next/prev controls
✅ Custom step names
✅ Step Navigation API

🔗 Get started formwerk.dev/guides/forms...

🔗 Release notes github.com/formwerkjs/f...
July 5, 2025 at 10:41 PM
We’ve been awfully quiet 🤫 but only because we’ve been step-ping things up 🪜

A new Formwerk release is on the way 🚀
Can you guess what’s flowing in? 👀
May 12, 2025 at 7:22 AM
Formwerk v0.10.4 is out 🔥 with a couple of minor bug 🐞 fixes around validation and mass setting form values.

🔗👇 Changelog
github.com/formwerkjs/f...
Release v0.10.4 · formwerkjs/formwerk
🐞 Bug Fixes Overwrite top-level keys when mass setting values #164  -  by @logaretm in #167 and #164 (016a8) validation: Properly combine validation sources  -  by @logaretm in #168 (15b54)   ...
github.com
April 1, 2025 at 3:09 PM
New showcase featuring the time and date fields 🔥👀

Animating date segment changes with @barvian.me's excellent NumberFlow for @vuejs.org

🔗👇
stackblitz.com/edit/formwer...
March 23, 2025 at 12:57 PM
🚀 Formwerk v0.10.0 is out 🔥

Introducing the Time 🕗 and File 📁 fields!

The file fields come with a11y, validation ✅, upload interface 🆙, dropzone, and file preview out of the box 😲

Your feedback is massively appreciated 🙏

📚 Docs
formwerk.dev

🔗 Release notes
github.com/formwerkjs/f...
March 16, 2025 at 8:17 PM
🚀 Formwerk v0.9.0: Introducing the OTP field 🔢

Now you can easily build accessible, flexible, and fully interactive OTP fields for @vuejs.org !

With validation, masking, prefixes, and full keyboard navigation with auto-submit, and much more.

📚 Check it out now
formwerk.dev/guides/field...
March 10, 2025 at 11:51 PM
Reposted by Formwerk
During #VueJsNation25, @formwerk.dev was introduced to the public for the first time!

Dive into a library for Vue.js that simplifies form creation while ensuring accessibility and internationalization with its creator, <a href="https://bsky.app/profile/did:plc:jeogp75rez3vvxqgr6seyp5j" class="hover:underline text-blue-600 dark:text-sky-400 no-card-link" target="_blank" rel="noopener" data-link="bsky-mention">@awad.dev. 🚀

https://youtu.be/vgCIZEGpgDU
Vue.js Nation 2025: Abdelrahman Awad - Form and Function with Formwerk
Abdelrahman Awad introduces Formwerk, a library for Vue.js that simplifies form creation while ensuring accessibility and internationalization.In this talk, ...
youtu.be
February 26, 2025 at 2:20 PM
Shipping on a Sunday? 😬

v0.8.2 is out with fixes & tweaks, but the big news...

🚀 Formwerk now has a @vuejs.org devtools plugin! 🎉

Just use any field or form composable and it will pop into your devtools!

It’s still an early release—excited to make this a great core DX! 🎉
February 23, 2025 at 3:12 PM
Reposted by Formwerk
. @formwerk.dev is a framework to help you build accessible, high-quality forms #madewithvuejs ⚙️ - https://madewithvuejs.com/formwerk
February 14, 2025 at 8:52 AM
We've just released v0.8.0 with a couple of new fields 🔥🚀

🫵 You can now build custom date field and calendar components and pair them to create a date picker field 📆

📚 Check the docs for examples:
formwerk.dev/guides/field...

🔗 Changelog: github.com/formwerkjs/f...
February 20, 2025 at 8:11 PM
Reposted by Formwerk
If you missed my talk @vuejsnation.com, you can now watch it on @vueschool.io's YouTube! 🎥👀

I showcased @formwerk.dev and our unique UI-less approach to high quality forms with a true focus on i18n and a great care on accessibility ✨

www.youtube.com/watch?v=vgCI...
Vue.js Nation 2025: Abdelrahman Awad - Form and Function with Formwerk
YouTube video by Vue School
www.youtube.com
February 13, 2025 at 11:30 AM
🚀 New Release to tidy some things up!

✨ New: getError, getValue, getErrors now available on form groups.
💥 Breaking: isValid, isTouched, isDirty are now methods.
🐞 Fixes: Improved dirty state tracking performance and reliability.

🔗 For more info github.com/formwerkjs/f...
February 8, 2025 at 6:30 PM
Don’t miss it 🔥 we have been prepping for it for some time now 🙌
[10/11] @awad.dev (Abdelrahman Awad) dives into creating perfect forms with Formwerk, focusing on accessibility and internationalization. 💚
January 30, 2025 at 2:27 PM
As soon as Standard schemas popped up, we made the switch early on. The potential was too great to ignore 🤯

Resolver-based API is NOT developer friendly, and it encourages vendor lock-in 🔒

We are extremely happy to be of its early adopters, and we hope to help shape it for better forms DX 🙌 🚀
BIG DAY 😇

Introducing Standard Schema! It’s a specification for a standard interface to be implemented by TypeScript schema libraries. The goal is to make it easier for frameworks and tools to accept user-defined schemas, without writing separate adapters for different libraries.
standardschema.dev
Standard Schema
A common interface for TypeScript validation libraries
standardschema.dev
January 28, 2025 at 11:31 AM
New Release: v0.6.3 🚀

🐞 Fixed a bug 🐞

✅ FormGroup validation not triggering parent form schema.

✨ A couple of improvements ✨

🪺 You can now nest form groups.
🌳 `setFieldTouch` now sets nested paths touched state.

We thank all the contributors! 🤝

github.com/formwerkjs/f...
Release v0.6.3 · formwerkjs/formwerk
🚀 Features Allow nesting form groups  -  by @genu in #111 (a33b3)    🐞 Bug Fixes Add group awareness, when using form actions.  -  by @genu in #109 (272ad) Propagate validation upwards in nes...
github.com
January 24, 2025 at 9:59 AM
🚀 Big news! Formwerk v0.6.0 is here! 🎉

✨ New composables:

`useComboBox`: Build comboboxes w/ filtering!
`useCustomField`: Wrap custom/non-standard form controls.

⚠️ Breaking change in selects

📝 Full notes: github.com/formwerkjs/f...

📚 Docs:
formwerk.dev
January 19, 2025 at 10:26 AM
Just merged! Comboboxes!

Accessible ✅
All the keyboard shortcuts ✅
Filters stuff ✅
Only 3 Lines of Script to build your own ✅🤯

Coming up in v0.6, we just need to write some docs 📚
January 17, 2025 at 8:03 PM
Our Roadmap is now live! If you are interested in an issue, chime in and contribute 🙌

We will be adding to it based on your feedback and needs as the project evolves ↗

github.com/orgs/formwer...
Roadmap • formwerkjs
This project helps us stay on track by documenting key milestones and major tasks that will shape the future of Formwerk.
github.com
January 6, 2025 at 2:33 PM
Reposted by Formwerk
🛠️ Formwerk

👉🏻 A suite of @vuejs.org composables designed to enhance your forms with built-in behaviors, interactions, internationalization, and accessibility, seamlessly integrating with your markup and styles.

https://formwerk.dev/
January 2, 2025 at 5:00 PM
New release! v0.5.0 🔥🎉

Did you want to show errors only on submit? 🤔
Or maybe show some UI after a successful submit? 🥳
Or disable UI when the user submits too much? ♾️

All that and more in v0.5.0 🔗👇

github.com/formwerkjs/f...
December 30, 2024 at 9:56 AM
Another showcase! 👀

Is it a form input? Maybe 🤔
Is it a component you will use? Unlikely 🤷‍♂️
Is there a better way to build it? Perhaps 🙂‍↕️

But, could you build it with Formwerk? Definitely! 💯

Using `useSlider` 🎚️ you only need to worry about styling your HTML.

Link in first reply 🔗👇
December 29, 2024 at 11:42 AM
Hey You 🫵

Did you know that you can use `useNumberField` with @barvian.me's Number Flow to build beautifully animated number fields? 🥹

You also get i18n and a11y support out of the box! what's not to like? 🔥

Link is in the first reply 👇🔗
December 26, 2024 at 1:52 PM
Hello World! this is Formwerk! A new uncompromising way of Building high-quality forms with @vuejs.org!

⚙️ Headless Composables with 0 UI
♿ Accessibility-First
🌐 i18n-ready
✅ Schema Validation
🧳And much more

Learn more at 📚
formwerk.dev

Give us a star ⭐️🤩
github.com/formwerkjs/formwerk
December 23, 2024 at 1:22 PM