Why is the "Checked" state missing when creating new Radio Buttons in Webflow?

Published on
September 22, 2023

When creating new radio buttons in Webflow, the "Checked" state might appear to be missing. However, this is not actually the case. The "Checked" state is automatically applied to a radio button when it is selected by default. This means that when you preview or publish your Webflow project, the radio button that is selected by default will have the "Checked" state applied to it.

To set a radio button as selected by default, follow these steps:

  1. Select the radio button element on your Webflow canvas.
  2. In the settings panel on the right-hand side, scroll down to the "Radio Button" section.
  3. In the "Options" field, enter the labels for your radio buttons, separating them with line breaks.
  4. Next to each option, you will see a small radio button icon. Click on the desired option to set it as selected by default. The "Checked" state will then be automatically applied to this option.
  5. If you prefer, you can also set the default selected option using interactions or custom code.

Keep in mind that the "Checked" state is only visible when the radio button is selected by default. If you want to style the radio button differently when it is selected, you can use custom CSS or Webflow interactions to achieve the desired effect.

In summary, the "Checked" state is not missing when creating new radio buttons in Webflow. It is automatically applied to the radio button that is selected by default.