Back
Form 7
Copy component
Copy component
Horizontal subscribe form featuring input fields for first name, last name, and email address.
Home
Components
Components
Contact Forms
Form 7
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"3d257cd1-6e65-f027-6413-23184511826e","type":"FormWrapper","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba5"],"children":["64b0042c-f6fe-e2f2-54c4-042050b6693d","7db677f7-390d-1263-b1d5-5e57bf6759b1","02bd9ec4-589a-63f5-cb24-f08c00fdee40","ef13025f-5556-dbb9-ca44-100c3b975ccb","6add3b28-bc1d-531d-e675-99a8d13a5cea"],"data":{"search":{"exclude":true},"form":{"type":"wrapper"},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]}}},{"_id":"64b0042c-f6fe-e2f2-54c4-042050b6693d","type":"Block","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceb9f"],"children":["60f0eaef-a99b-49d7-26ab-94805b80be37","c1572630-e1da-90d4-7d35-d6f301e8c0b8","fc689634-3672-e7fb-9e55-d11fbcfc5c61"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"60f0eaef-a99b-49d7-26ab-94805b80be37","type":"Block","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba1"],"children":["e9dc4796-1fca-1ea6-bd41-c50d4c863e35"],"data":{"text":true,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"e9dc4796-1fca-1ea6-bd41-c50d4c863e35","text":true,"v":"Get in touch"},{"_id":"c1572630-e1da-90d4-7d35-d6f301e8c0b8","type":"Heading","tag":"h2","classes":["c482fb55-1d94-a606-7a8a-5860e32cebac"],"children":["5dd251c6-f46b-defd-ddfb-c3d7b5b4647d"],"data":{"tag":"h2","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"5dd251c6-f46b-defd-ddfb-c3d7b5b4647d","text":true,"v":"Contact us"},{"_id":"fc689634-3672-e7fb-9e55-d11fbcfc5c61","type":"Paragraph","tag":"p","classes":["c482fb55-1d94-a606-7a8a-5860e32ceb9a"],"children":["ae038d8c-249e-15c6-8b9d-513f8a744f13"],"data":{"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"ae038d8c-249e-15c6-8b9d-513f8a744f13","text":true,"v":"I guess it comes down to a simple choice, really. Get busy living or get busy dying."},{"_id":"7db677f7-390d-1263-b1d5-5e57bf6759b1","type":"HtmlEmbed","tag":"div","classes":["b3b3fa10-1331-be13-ace4-d3fdd708b709"],"children":[],"v":"<style>\n/* Align the checkbox icon to the left of the .form-2_form-checkbox container */\n.form-2_form-checkbox.w-checkbox::before {\n\tdisplay: none;\n}\n</style>","data":{"search":{"exclude":true},"embed":{"meta":{"html":"<style>\n/* Align the checkbox icon to the left of the .form-2_form-checkbox container */\n.form-2_form-checkbox.w-checkbox::before {\n\tdisplay: none;\n}\n</style>","div":false,"script":false,"compilable":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]}}},{"_id":"02bd9ec4-589a-63f5-cb24-f08c00fdee40","type":"FormForm","tag":"form","classes":["c482fb55-1d94-a606-7a8a-5860e32ceb97"],"children":["85b6d739-9a67-76fe-9e0d-f434ea4cc134","fac80521-a616-cc7a-3d8b-5beae971145b","c5602abc-35b1-aabd-52ac-c2009b9c9f6f","a29f627d-820d-b39b-e325-0013657d7f19"],"data":{"Source":{"tag":"Default form","val":{}},"form":{"type":"form","name":"Form 7"},"attr":{"id":"wf-form-Form-7","name":"wf-form-Form-7","data-name":"Form 7","redirect":"","data-redirect":"","action":"","method":"get"},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"85b6d739-9a67-76fe-9e0d-f434ea4cc134","type":"Block","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceb9b"],"children":["81df957f-e9f5-ecbc-f51e-8f823ff6c5bd","345def6f-09e4-5cb1-9fec-48bbf5dcd32a"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"81df957f-e9f5-ecbc-f51e-8f823ff6c5bd","type":"Block","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba2"],"children":["82ef3562-d273-fdfa-ef8a-88dacf756d20","52e9d693-6125-8564-9dbd-8160faeedaa0"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"82ef3562-d273-fdfa-ef8a-88dacf756d20","type":"FormBlockLabel","tag":"label","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba6"],"children":["b4e1f1f7-ffc3-c956-add6-49401fabfcc7"],"data":{"attr":{"for":"Form-7-Name","id":""},"form":{"type":"label","passwordPage":false},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"b4e1f1f7-ffc3-c956-add6-49401fabfcc7","text":true,"v":"Name"},{"_id":"52e9d693-6125-8564-9dbd-8160faeedaa0","type":"FormTextInput","tag":"input","classes":["c482fb55-1d94-a606-7a8a-5860e32cebab"],"children":[],"data":{"form":{"name":"Form 7 Name","type":"input","passwordPage":false},"attr":{"id":"Form-7-Name","name":"Form-7-Name","maxlength":256,"data-name":"Form 7 Name","placeholder":"Full name","disabled":false,"type":"text","required":true,"autofocus":false},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"345def6f-09e4-5cb1-9fec-48bbf5dcd32a","type":"Block","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba2"],"children":["b75ef606-2d6c-9189-494b-1e8d68016559","9835630b-5bc6-2629-5e26-80d670662032"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"b75ef606-2d6c-9189-494b-1e8d68016559","type":"FormBlockLabel","tag":"label","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba6"],"children":["5ec93e7b-cd61-57a0-ba19-9d67ebef931d"],"data":{"attr":{"for":"Form-7-Email-Address","id":""},"form":{"type":"label","passwordPage":false},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"5ec93e7b-cd61-57a0-ba19-9d67ebef931d","text":true,"v":"Email address"},{"_id":"9835630b-5bc6-2629-5e26-80d670662032","type":"FormTextInput","tag":"input","classes":["c482fb55-1d94-a606-7a8a-5860e32cebab"],"children":[],"data":{"form":{"name":"Form 7 Email Address","type":"input","passwordPage":false},"attr":{"id":"Form-7-Email-Address","name":"Form-7-Email-Address","maxlength":256,"data-name":"Form 7 Email Address","placeholder":"Email address","disabled":false,"type":"email","required":true,"autofocus":false},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"fac80521-a616-cc7a-3d8b-5beae971145b","type":"Block","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba2"],"children":["eaa79ec7-7ceb-d116-e53d-bff240612b80","abdbe371-bba4-5f77-7a4c-1780477ea36b"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"eaa79ec7-7ceb-d116-e53d-bff240612b80","type":"FormBlockLabel","tag":"label","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba6"],"children":["6a7a418b-bbcc-76be-2d99-503653530928"],"data":{"attr":{"for":"Form-7-Selection","id":""},"form":{"type":"label","passwordPage":false},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"6a7a418b-bbcc-76be-2d99-503653530928","text":true,"v":"What is this about?"},{"_id":"abdbe371-bba4-5f77-7a4c-1780477ea36b","type":"FormSelect","tag":"select","classes":["c482fb55-1d94-a606-7a8a-5860e32cebab","c482fb55-1d94-a606-7a8a-5860e32cebaf"],"children":[],"data":{"form":{"name":"Form 7 Selection","opts":[{"t":"Please select one","v":""},{"t":"Design","v":"Design"},{"t":"Development","v":"Development"},{"t":"User Experience","v":"UX"},{"t":"Customer Support","v":"Support"}],"type":"select"},"attr":{"id":"Form-7-Selection","name":"Form-7-Selection","data-name":"Form 7 Selection","required":false,"multiple":false},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"c5602abc-35b1-aabd-52ac-c2009b9c9f6f","type":"Block","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba2"],"children":["14ccabc3-4b41-97c2-ada8-fce9e75e5a3b","f9968b4a-d3b9-1dc2-ce5f-d2fa3b7f4869"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"14ccabc3-4b41-97c2-ada8-fce9e75e5a3b","type":"FormBlockLabel","tag":"label","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba6"],"children":["a60bfaa8-e5bd-fdb6-28bd-34f21da43a50"],"data":{"attr":{"for":"Form-7-Message","id":""},"form":{"type":"label","passwordPage":false},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a60bfaa8-e5bd-fdb6-28bd-34f21da43a50","text":true,"v":"Message"},{"_id":"f9968b4a-d3b9-1dc2-ce5f-d2fa3b7f4869","type":"FormTextarea","tag":"textarea","classes":["c482fb55-1d94-a606-7a8a-5860e32cebab","c482fb55-1d94-a606-7a8a-5860e32cebad"],"children":[],"data":{"form":{"name":"Form 7 Message","type":"textarea"},"attr":{"id":"Form-7-Message","name":"Form-7-Message","maxlength":5000,"data-name":"Form 7 Message","placeholder":"Please type your message here...","required":true,"autofocus":false},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"a29f627d-820d-b39b-e325-0013657d7f19","type":"FormButton","tag":"input","classes":["27e2c28d-84e7-9136-e293-5ae1ccc4f8d9","27e2c28d-84e7-9136-e293-5ae1ccc4f8de"],"children":[],"data":{"form":{"type":"button"},"attr":{"type":"submit","value":"Send message","data-wait":"Please wait...","id":""},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"ef13025f-5556-dbb9-ca44-100c3b975ccb","type":"FormSuccessMessage","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba9"],"children":["4a343aa4-32e2-cf90-11b2-47213c61034c"],"data":{"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"msg-done"}}},{"_id":"4a343aa4-32e2-cf90-11b2-47213c61034c","type":"Block","tag":"div","classes":[],"children":["159c6636-cbf0-24c5-7753-2bee1e5d83a1"],"data":{"text":true,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"159c6636-cbf0-24c5-7753-2bee1e5d83a1","text":true,"v":"Thank you! Your submission has been received!"},{"_id":"6add3b28-bc1d-531d-e675-99a8d13a5cea","type":"FormErrorMessage","tag":"div","classes":["c482fb55-1d94-a606-7a8a-5860e32ceba8"],"children":["b2386e2b-5d38-09c7-1caa-aff482b97515"],"data":{"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"type":"msg-fail"}}},{"_id":"b2386e2b-5d38-09c7-1caa-aff482b97515","type":"Block","tag":"div","classes":[],"children":["c14b8b9e-b187-d8d0-a7d5-8d85e0cc9e46"],"data":{"text":true,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"c14b8b9e-b187-d8d0-a7d5-8d85e0cc9e46","text":true,"v":"Oops! Something went wrong while submitting the form."}],"styles":[{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceb9b","fake":false,"type":"class","name":"form-7_grid","namespace":"","comb":"","styleLess":"display: grid; width: 100%; grid-auto-columns: 1fr; grid-column-gap: 3rem; grid-row-gap: 3rem; grid-template-columns: 1fr 1fr; grid-template-rows: auto;","variants":{"tiny":{"styleLess":"grid-template-columns: 1fr;"},"small":{"styleLess":"grid-row-gap: 0rem; grid-template-columns: 1fr;"}},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceba1","fake":false,"type":"class","name":"form-7_header_eyebrow","namespace":"","comb":"","styleLess":"color: #0c60f5; font-weight: 700;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceb9f","fake":false,"type":"class","name":"form-7_header","namespace":"","comb":"","styleLess":"display: flex; margin-bottom: 2rem; flex-direction: column; justify-content: flex-start; flex-wrap: nowrap; align-items: flex-start; grid-column-gap: 0.5rem; grid-row-gap: 0.5rem;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32cebaf","fake":false,"type":"class","name":"is-select-input","namespace":"","comb":"&","styleLess":"color: #7587a5;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"27e2c28d-84e7-9136-e293-5ae1ccc4f8de","fake":false,"type":"class","name":"is-form-submit","namespace":"","comb":"&","styleLess":"","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceba2","fake":false,"type":"class","name":"form-7_field-wrapper","namespace":"","comb":"","styleLess":"width: 100%;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceb97","fake":false,"type":"class","name":"form-7_form","namespace":"","comb":"","styleLess":"display: flex; flex-direction: column; justify-content: flex-start; flex-wrap: nowrap; align-items: flex-start; grid-column-gap: 1.5rem; grid-row-gap: 1.5rem;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32cebab","fake":false,"type":"class","name":"form-7_input","namespace":"","comb":"","styleLess":"height: 3.325rem; margin-bottom: 0px; padding-top: 1rem; padding-right: 1rem; padding-bottom: 1rem; padding-left: 1rem; border-top-style: solid; border-top-width: 0.0625rem; border-top-color: #9eabc1; border-right-style: solid; border-right-width: 0.0625rem; border-right-color: #9eabc1; border-bottom-style: solid; border-bottom-width: 0.0625rem; border-bottom-color: #9eabc1; border-left-style: solid; border-left-width: 0.0625rem; border-left-color: #9eabc1; background-color: white; font-size: 1rem; line-height: 1.2em;","variants":{"main_placeholder":{"styleLess":"color: #7587a5;"},"main_focus":{"styleLess":"border-top-color: #0c60f5; border-right-color: #0c60f5; border-bottom-color: #0c60f5; border-left-color: #0c60f5;"}},"children":["c482fb55-1d94-a606-7a8a-5860e32cebad","c482fb55-1d94-a606-7a8a-5860e32cebaf"],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceba6","fake":false,"type":"class","name":"form-7_label","namespace":"","comb":"","styleLess":"margin-bottom: 0.25rem; align-self: flex-start; color: #0f1929; font-weight: 700;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceba8","fake":false,"type":"class","name":"form-7_error","namespace":"","comb":"","styleLess":"margin-top: 0.5rem; padding-top: 1rem; padding-right: 1rem; padding-bottom: 1rem; padding-left: 1rem; background-color: #d91b5f; color: white; font-weight: 700;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceba9","fake":false,"type":"class","name":"form-7_success","namespace":"","comb":"","styleLess":"margin-top: 0px; padding-top: 1rem; padding-right: 1rem; padding-bottom: 1rem; padding-left: 1rem; background-color: #00c394; color: black; font-weight: 700;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"27e2c28d-84e7-9136-e293-5ae1ccc4f8d9","fake":false,"type":"class","name":"button","namespace":"","comb":"","styleLess":"display: inline-block; padding-top: 1rem; padding-right: 1.5rem; padding-bottom: 1rem; padding-left: 1.5rem; border-top-style: solid; border-top-width: 2px; border-top-color: #0c60f5; border-right-style: solid; border-right-width: 2px; border-right-color: #0c60f5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0c60f5; border-left-style: solid; border-left-width: 2px; border-left-color: #0c60f5; background-color: #0c60f5; color: white; font-size: 1em; line-height: 1.125em; font-weight: 700; text-align: center; text-decoration: none; white-space: nowrap;","variants":{"main_hover":{"styleLess":"border-top-color: #0049ca; border-right-color: #0049ca; border-bottom-color: #0049ca; border-left-color: #0049ca; background-color: #0049ca;"}},"children":["27e2c28d-84e7-9136-e293-5ae1ccc4f8de","a6b7c620-6703-68cb-4e59-d2b3a9d1ab04","5eb34a0d-1d4c-bc49-56cf-7af9cc5e2dcf","3b4f261d-5209-659d-b43e-d49e7abe6e82"],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32cebac","fake":false,"type":"class","name":"form-7_header_heading","namespace":"","comb":"","styleLess":"margin-top: 0px; margin-bottom: 0px;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceb9a","fake":false,"type":"class","name":"form-7_header_paragraph","namespace":"","comb":"","styleLess":"margin-bottom: 0px;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"b3b3fa10-1331-be13-ace4-d3fdd708b709","fake":false,"type":"class","name":"CODE: Checkbox Alignment","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32ceba5","fake":false,"type":"class","name":"form-7","namespace":"","comb":"","styleLess":"margin-bottom: 0px;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"c482fb55-1d94-a606-7a8a-5860e32cebad","fake":false,"type":"class","name":"is-text-area","namespace":"","comb":"&","styleLess":"height: 12rem;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0,"universalBindingsRemovedCount":0,"unlinkedSymbolCount":0}}
Built by hand with
from