Skip to content
Create form

Switch

The Switch component provides a visual toggle for binary yes/no choices. It offers a more modern, interactive alternative to checkboxes for collecting on/off or yes/no responses.

Switch is ideal for:

  • Preference toggles (yes/no)
  • Feature opt-ins
  • Settings-style questions
  • Binary choices with clear on/off states
  • Modern, interactive form designs
  1. Open your form in the editor

  2. Drag the Switch component from the left sidebar onto your form

  3. Click the component to select it and configure its settings

The text that describes what the switch controls.

Tips for effective labels:

  • Phrase as a statement that can be true or false
  • Make it clear what “on” means
  • Keep it concise

Examples:

  • “Receive email notifications”
  • “Enable dark mode”
  • “Subscribe to updates”
  • “Make my profile public”

Optional helper text that appears near the switch.

When to use descriptions:

  • To explain what happens when enabled/disabled
  • To provide additional context
  • To clarify the implications of the choice

Examples:

  • “We’ll send you weekly digest emails”
  • “Your profile will be visible to other users”
  • “You can change this setting later”

Set whether the switch starts in the on or off position.

Considerations for default value:

  • Off (default): User must actively opt in
  • On: User must actively opt out

Toggle whether the user must interact with the switch before submitting.

When enabled:

  • Users must explicitly set the switch (can’t leave it in default state without interaction)
  • Useful when you need a deliberate choice, not just acceptance of a default

The switch has two visual states:

StateAppearanceMeaning
OffToggle on left, muted colorNo / Disabled / False
OnToggle on right, active colorYes / Enabled / True

Both components collect yes/no responses, but they have different use cases:

AspectSwitchCheckbox
Visual styleModern, interactiveTraditional, familiar
Best forSettings, preferencesAgreements, confirmations
InteractionSlide or clickClick to check
Default stateCan default to on or offTypically unchecked
User expectationToggle a settingConfirm or agree

Use Switch when:

  • The question feels like a setting or preference
  • You want a more modern, interactive feel
  • The choice is about enabling/disabling something

Use Checkbox when:

  • Collecting agreement or consent
  • The pattern is “I confirm…” or “I agree…”
  • Users expect a traditional form experience

Label clearly. The label should make it obvious what “on” means without needing to see the switch state.

Consider the default carefully. The default state influences user behavior. Opt-in defaults are more ethical for marketing preferences.

Use for settings-style questions. Switches feel natural for preferences and settings, less so for confirmations.

Provide context. Use descriptions to explain the implications of each state.

Don’t overuse. A form full of switches can feel overwhelming. Mix with other component types.

The Switch component is built with accessibility in mind:

  • Proper toggle button semantics
  • Keyboard accessible (Space or Enter to toggle)
  • Screen reader announces state changes
  • Clear visual distinction between states
  • Focus states are clearly visible

Switch responses in your form results:

  • Display as “Yes” or “No” (or On/Off)
  • Can be filtered by state
  • Are included in exports as boolean values
  • Useful for segmenting respondents by preference

Ready to create your first Fomr?

See how easy it is to create a new form in a matter of minutes.