Loading Component...

Loading

More Components

View All
Oops! Something went wrong while submitting the form.
Toggle Checkbox
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c4","type":"Block","tag":"div","classes":[],"children":["35ce9331-d8e8-61ca-a4b0-287f9e29c7c5","e289c0d1-fadc-66c7-1f14-821b3dcfca9c"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c5","type":"FormCheckboxWrapper","tag":"div","classes":["fb1a19fb-d47f-1bd0-272d-8f366430125c"],"children":["35ce9331-d8e8-61ca-a4b0-287f9e29c7c6","35ce9331-d8e8-61ca-a4b0-287f9e29c7c7","35ce9331-d8e8-61ca-a4b0-287f9e29c7c9","35ce9331-d8e8-61ca-a4b0-287f9e29c7ca"],"data":{"form":{"type":"checkbox"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c6","type":"FormCheckboxInput","tag":"input","classes":["fb1a19fb-d47f-1bd0-272d-8f3664301264"],"children":[],"data":{"attr":{"id":"Checkbox-1","type":"checkbox","name":"Checkbox-1","data-name":"Checkbox 1","required":false,"checked":true},"form":{"type":"checkbox-input","name":"Checkbox 1"},"inputType":"default","displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c7","type":"FormInlineLabel","tag":"label","classes":["fb1a19fb-d47f-1bd0-272d-8f366430125e"],"children":["35ce9331-d8e8-61ca-a4b0-287f9e29c7c8"],"data":{"form":{"type":"checkbox-label"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c8","text":true,"v":"Toggle ON"},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c9","type":"Block","tag":"div","classes":["fb1a19fb-d47f-1bd0-272d-8f3664301263"],"children":[],"data":{"text":false,"tag":"div","displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7ca","type":"Block","tag":"div","classes":["fb1a19fb-d47f-1bd0-272d-8f366430125d"],"children":[],"data":{"text":false,"tag":"div","displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"e289c0d1-fadc-66c7-1f14-821b3dcfca9c","type":"HtmlEmbed","tag":"div","classes":["16a8e866-6793-e34b-af1d-bf9bcb63243c"],"children":[],"v":"Custom CSS\n<style> \n.ms-toggle-checkbox:checked ~.ms-toggle-bg {\n\tbackground-color: #2962ff;\n}\n.ms-toggle-checkbox:checked ~.ms-toggle-dot {\n\tleft: 19px;\n}\n</style>","data":{"insideRTE":false,"search":{"exclude":true},"embed":{"meta":{"html":"Custom CSS\n<style> \n.ms-toggle-checkbox:checked ~.ms-toggle-bg {\n\tbackground-color: #2962ff;\n}\n.ms-toggle-checkbox:checked ~.ms-toggle-dot {\n\tleft: 19px;\n}\n</style>","div":false,"script":false,"compilable":false,"iframe":false},"type":"html"},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}}],"styles":[{"_id":"fb1a19fb-d47f-1bd0-272d-8f366430125c","fake":false,"type":"class","name":"MS Toggle Wrap","namespace":"","comb":"","styleLess":"position: relative; width: 50px; height: 34px; margin-bottom: 15px;","variants":{},"children":["fb1a19fb-d47f-1bd0-272d-8f3664301268","fb1a19fb-d47f-1bd0-272d-8f3664301269"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"fb1a19fb-d47f-1bd0-272d-8f3664301264","fake":false,"type":"class","name":"MS Toggle Checkbox","namespace":"","comb":"","styleLess":"display: none;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"fb1a19fb-d47f-1bd0-272d-8f366430125e","fake":false,"type":"class","name":"MS Toggle Label","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: auto; bottom: 0%; z-index: 2; display: flex; padding-left: 65px; justify-content: flex-start; align-items: center; font-weight: 700; white-space: nowrap;","variants":{},"children":["fb1a19fb-d47f-1bd0-272d-8f366430126b","fb1a19fb-d47f-1bd0-272d-8f366430126f"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"fb1a19fb-d47f-1bd0-272d-8f3664301263","fake":false,"type":"class","name":"MS Toggle Dot","namespace":"","comb":"","styleLess":"position: absolute; left: 3px; z-index: 1; width: 28px; height: 28px; margin-top: 3px; border-top-left-radius: 50%; border-top-right-radius: 50%; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; background-color: white; box-shadow: 0 1px 5px 0 rgba(0,0,0,0.2); transition-property: left; transition-duration: 200ms; transition-timing-function: ease;","variants":{"main_redirected-checked":{"styleLess":"left: 39px; background-color: white; background-image: none;"}},"children":["fb1a19fb-d47f-1bd0-272d-8f366430126c","fb1a19fb-d47f-1bd0-272d-8f366430126e"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"fb1a19fb-d47f-1bd0-272d-8f366430125d","fake":false,"type":"class","name":"MS Toggle BG","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; z-index: 0; width: 50px; border-top-left-radius: 100px; border-top-right-radius: 100px; border-bottom-left-radius: 100px; border-bottom-right-radius: 100px; background-color: hsla(0, 0.00%, 88.63%, 1.00); transition-property: background-color; transition-duration: 200ms; transition-timing-function: ease;","variants":{},"children":["fb1a19fb-d47f-1bd0-272d-8f366430126a"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"16a8e866-6793-e34b-af1d-bf9bcb63243c","fake":false,"type":"class","name":"MS Embed","namespace":"","comb":"","styleLess":"display: flex; min-height: 50px; margin-bottom: 10px; justify-content: center; align-items: center; background-color: hsla(0, 0.00%, 92.94%, 1.00); font-style: italic;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Clone in Webflow
Copy Component
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c4","type":"Block","tag":"div","classes":[],"children":["35ce9331-d8e8-61ca-a4b0-287f9e29c7c5","e289c0d1-fadc-66c7-1f14-821b3dcfca9c"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c5","type":"FormCheckboxWrapper","tag":"div","classes":["fb1a19fb-d47f-1bd0-272d-8f366430125c"],"children":["35ce9331-d8e8-61ca-a4b0-287f9e29c7c6","35ce9331-d8e8-61ca-a4b0-287f9e29c7c7","35ce9331-d8e8-61ca-a4b0-287f9e29c7c9","35ce9331-d8e8-61ca-a4b0-287f9e29c7ca"],"data":{"form":{"type":"checkbox"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c6","type":"FormCheckboxInput","tag":"input","classes":["fb1a19fb-d47f-1bd0-272d-8f3664301264"],"children":[],"data":{"attr":{"id":"Checkbox-1","type":"checkbox","name":"Checkbox-1","data-name":"Checkbox 1","required":false,"checked":true},"form":{"type":"checkbox-input","name":"Checkbox 1"},"inputType":"default","displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c7","type":"FormInlineLabel","tag":"label","classes":["fb1a19fb-d47f-1bd0-272d-8f366430125e"],"children":["35ce9331-d8e8-61ca-a4b0-287f9e29c7c8"],"data":{"form":{"type":"checkbox-label"},"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]}}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c8","text":true,"v":"Toggle ON"},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7c9","type":"Block","tag":"div","classes":["fb1a19fb-d47f-1bd0-272d-8f3664301263"],"children":[],"data":{"text":false,"tag":"div","displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"35ce9331-d8e8-61ca-a4b0-287f9e29c7ca","type":"Block","tag":"div","classes":["fb1a19fb-d47f-1bd0-272d-8f366430125d"],"children":[],"data":{"text":false,"tag":"div","displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"e289c0d1-fadc-66c7-1f14-821b3dcfca9c","type":"HtmlEmbed","tag":"div","classes":["16a8e866-6793-e34b-af1d-bf9bcb63243c"],"children":[],"v":"Custom CSS\n<style> \n.ms-toggle-checkbox:checked ~.ms-toggle-bg {\n\tbackground-color: #2962ff;\n}\n.ms-toggle-checkbox:checked ~.ms-toggle-dot {\n\tleft: 19px;\n}\n</style>","data":{"insideRTE":false,"search":{"exclude":true},"embed":{"meta":{"html":"Custom CSS\n<style> \n.ms-toggle-checkbox:checked ~.ms-toggle-bg {\n\tbackground-color: #2962ff;\n}\n.ms-toggle-checkbox:checked ~.ms-toggle-dot {\n\tleft: 19px;\n}\n</style>","div":false,"script":false,"compilable":false,"iframe":false},"type":"html"},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]},"devlink":{"runtimeProps":{},"slot":""}}}],"styles":[{"_id":"fb1a19fb-d47f-1bd0-272d-8f366430125c","fake":false,"type":"class","name":"MS Toggle Wrap","namespace":"","comb":"","styleLess":"position: relative; width: 50px; height: 34px; margin-bottom: 15px;","variants":{},"children":["fb1a19fb-d47f-1bd0-272d-8f3664301268","fb1a19fb-d47f-1bd0-272d-8f3664301269"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"fb1a19fb-d47f-1bd0-272d-8f3664301264","fake":false,"type":"class","name":"MS Toggle Checkbox","namespace":"","comb":"","styleLess":"display: none;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"fb1a19fb-d47f-1bd0-272d-8f366430125e","fake":false,"type":"class","name":"MS Toggle Label","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: auto; bottom: 0%; z-index: 2; display: flex; padding-left: 65px; justify-content: flex-start; align-items: center; font-weight: 700; white-space: nowrap;","variants":{},"children":["fb1a19fb-d47f-1bd0-272d-8f366430126b","fb1a19fb-d47f-1bd0-272d-8f366430126f"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"fb1a19fb-d47f-1bd0-272d-8f3664301263","fake":false,"type":"class","name":"MS Toggle Dot","namespace":"","comb":"","styleLess":"position: absolute; left: 3px; z-index: 1; width: 28px; height: 28px; margin-top: 3px; border-top-left-radius: 50%; border-top-right-radius: 50%; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; background-color: white; box-shadow: 0 1px 5px 0 rgba(0,0,0,0.2); transition-property: left; transition-duration: 200ms; transition-timing-function: ease;","variants":{"main_redirected-checked":{"styleLess":"left: 39px; background-color: white; background-image: none;"}},"children":["fb1a19fb-d47f-1bd0-272d-8f366430126c","fb1a19fb-d47f-1bd0-272d-8f366430126e"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"fb1a19fb-d47f-1bd0-272d-8f366430125d","fake":false,"type":"class","name":"MS Toggle BG","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; z-index: 0; width: 50px; border-top-left-radius: 100px; border-top-right-radius: 100px; border-bottom-left-radius: 100px; border-bottom-right-radius: 100px; background-color: hsla(0, 0.00%, 88.63%, 1.00); transition-property: background-color; transition-duration: 200ms; transition-timing-function: ease;","variants":{},"children":["fb1a19fb-d47f-1bd0-272d-8f366430126a"],"createdBy":"572e16b6f586648f39f82496","selector":null},{"_id":"16a8e866-6793-e34b-af1d-bf9bcb63243c","fake":false,"type":"class","name":"MS Embed","namespace":"","comb":"","styleLess":"display: flex; min-height: 50px; margin-bottom: 10px; justify-content: center; align-items: center; background-color: hsla(0, 0.00%, 92.94%, 1.00); font-style: italic;","variants":{},"children":[],"createdBy":"572e16b6f586648f39f82496","selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Browser not supported. Use
CC Chrome or SS Safari.