How to Add and Set Up the Square Radio Buttons Widget on Your Form

March 17, 2026

Jotform’s Square Radio Buttons widget gives your forms a modern twist by replacing the usual round radio buttons with sleek square ones. It’s a simple way to freshen up your form’s design while still letting users choose just one option from a list. Perfect for surveys, polls, quizzes, or any form where you want clean, stylish single-choice fields.

Here are a few ways to use it:

  • Present Single-Choice Options in a Bold Layout  — You can use the Square Radio widget to display options as square buttons instead of traditional radio buttons. This makes selections more noticeable and visually engaging.
  • Highlight Product or Plan Selections — The widget works well for showcasing products, pricing tiers, or subscription plans. Each option stands out clearly, helping users compare and choose one easily.
  • Create Image-Based Selection Choices — You can customize the square options with images or icons, making it ideal for selecting styles, designs, or categories in a more visual way.
  • Improve Mobile Selection Experience — The larger square buttons make it easier for users to tap and select an option on mobile devices, reducing input errors.

Note

The Square Radio Buttons widget is designed for single selections—perfect when you only want users to pick one option from the list.

Adding and Setting Up the Add to Square Radio Buttons Widget

Adding the Square Radio Buttons widget to your form gives your fields a fresh, modern look by swapping out the usual round buttons for stylish square ones. You can do it in a few simple steps:

  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 form fields and widgets
  1. Now, in the Form Elements menu, under the Widgets tab, search for Square Radio Buttons 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 Square Radio Buttons widget being searched and added to a form
  1. Next, in the Widget Settings menu that opens on the right side of the page, set up these options:
    • Options — Add the list of choices you want people to pick from. Each one you enter will appear as a square radio button on your form.
    • Color Scheme — Choose the overall color style for your radio buttons so they blend nicely with your form’s design or match your brand colors.
    • Font — Select the font style that best fits the look and feel of your form, keeping it consistent with the rest of your fields.
    • Font Color — Pick a text color for your options to make them stand out or keep things subtle, depending on your form’s vibe.
  2. Once you’re done, click on Update.
Square Radio Buttons widget settings panel showing options to add choices, select a color scheme, and customize font and font color

That’s it. You’ve successfully added and set up the Square Radio Buttons widget to your form. Now, you have a field in your form that swaps the usual round buttons for clean, modern square ones—giving your form a fresh look while still keeping it simple and easy for people to make their choice. Curious how it works on a live form? Check out this Demo Form.

Form with the Square Radio Buttons widget added, displaying modern square-style radio button choices for user selection

To further customize your Square Radio Buttons field’s 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 Square Radio Buttons field. Our guide on How to Inject CSS Codes to Widgets walks you through everything.

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.