I'd really like to use on / off toggle switches on my VF / lightning pages rather than a checkbox. Such as these used in the lightning setup pages

enter image description here

Are these available to developers as part of the lightning design framework, I can't see them listed?

Any examples would be great, thanks!


I think you have to copy the html and css code from the salesforce page and implement your own component because there is no native / official toggle/switch component from the lightning design system at the moment.

Alternatively you could take a bootstrap switch component.

| improve this answer | |
  • Thanks, thats what I guessed. Seems strange they didn't include it since they clearly used it themselves. – Neil Dec 15 '15 at 20:23
  • @Neil Yep. Many of components are stil on the "beta" status, so I think we have to wait a bit till all of them will be implemented. – Sergej Utko Dec 15 '15 at 20:40

Try the checkbox toggle. I think it was added fairly recently.


| improve this answer | |

If you are using new Lightning web components or aura components you can have on/off switch by using lightning input component with type toggle

<lightning-input name="toggle" label="Toggle" type="toggle" message-toggle-active="toggle on" message-toggle-inactive="toggle off"> </lightning-input>


| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.