How to Add and Set Up the Knob Widget on Your Form

April 7, 2026

The Knob Widget is a fun and interactive way for users to input numerical values on your form. It lets respondents simply turn a dial to select a number, making data entry more engaging and intuitive than typing in a value. Whether you’re collecting ratings, setting quantities, or measuring preferences, this widget adds a sleek, hands-on element to your form.

Here are a few ways to use it:

  • Collect Ratings or Scores Instead of a plain number field, let users “dial in” their rating. Perfect for feedback forms, surveys, or performance assessments.
  • Fine-Tune Quantities or Percentages Use it for things like budgeting, project estimates, or progress tracking. Users can easily adjust values with a smooth, tactile interface.
  • Interactive Forms for Learning or Games If your form includes quizzes, training exercises, or interactive tools, the knob adds a playful and engaging element that keeps users involved.
  • Visualize Choices Clearly —The circular design makes it easy to see at a glance what value has been selected. It’s especially handy when you want input to feel precise yet intuitive.

Adding and Setting Up the Knob Widget

Adding the Knob widget to your form gives your users a fun, intuitive way to select a value by simply turning a dial. Here’s how to get going:

  1. In Form Builder, click on Add Element on the left side of the page.
Form Builder interface highlighting the Add Element button on the left panel to add new fields and widgets
  1. Now, in the Form Elements menu, under the Widgets tab, search for Knob and then click on it. Or, just drag and drop it to where you want it to be on your form.
Form Elements panel under the Widgets tab showing the Knob widget being searched and added to a form

Just add a field label, and you’re all set. You’ve successfully added and set up the Knob widget on your form. Now your users can easily adjust values with a simple turn of the dial, giving them a smooth, interactive way to input numbers with precision. Curious how it works on a live form? Check out this Demo Form.

Form with the Knob widget added, allowing users to adjust values interactively using a dial

To further customize your Knob field appearance, just click on the Gear icon to open its properties

Note

For advanced styling, you can add your own custom CSS under the Custom CSS tab in the widget settings and style the Knob field. Our guide on How to Inject CSS Codes to Widgets walks you through everything.

Pro Tip

The Knob Widget is great when you want users to choose a value with a simple twist—perfect for ratings, intensity levels, or any form where sliders feel too long.

Send Comment:

Jotform Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Podo Comment Be the first to comment.
Still have unanswered questions?

We’re here for you 24/7, anytime you need us day or night. Have a question or need a hand with something? Our team is always ready to help out.