Back
Banner 20
Copy component
Copy component
Horizontal banner featuring a subscription form with both name and email address input fields.
Home
Components
Components
Banner
Banner 20
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"44c33759-a1af-5ec7-e344-ef0e4951e973","type":"Link","tag":"a","classes":["d32fac10-49bc-c8bd-a319-1ec7ace0f2a6"],"children":["39622d20-8d70-efcc-f300-86eea66d46f7","f2271d3d-1e34-cdd1-4e30-54f5410a22e0","94fa598d-acb5-2c95-6ce4-b3b287d88f5b"],"data":{"button":false,"block":"inline","link":{"mode":"external","url":"#"},"attr":{"id":""},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"39622d20-8d70-efcc-f300-86eea66d46f7","type":"Block","tag":"div","classes":["d32fac10-49bc-c8bd-a319-1ec7ace0f2a7"],"children":["ee87766a-f45b-0fc0-4abf-1cf1bab25337"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"ee87766a-f45b-0fc0-4abf-1cf1bab25337","type":"HtmlEmbed","tag":"div","classes":["d32fac10-49bc-c8bd-a319-1ec7ace0f2a8"],"children":[],"v":"<svg width=\"auto\" height=\"auto\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M16.7729 8.28771C17.0658 7.99481 17.0658 7.51994 16.7729 7.22705C16.48 6.93415 16.0052 6.93415 15.7123 7.22705L16.7729 8.28771ZM7.22699 15.7123C6.9341 16.0052 6.9341 16.4801 7.22699 16.773C7.51989 17.0659 7.99476 17.0659 8.28765 16.773L7.22699 15.7123ZM15.7123 16.7729C16.0052 17.0658 16.48 17.0658 16.7729 16.7729C17.0658 16.48 17.0658 16.0052 16.7729 15.7123L15.7123 16.7729ZM8.28765 7.22699C7.99476 6.9341 7.51989 6.9341 7.22699 7.22699C6.9341 7.51989 6.9341 7.99476 7.22699 8.28765L8.28765 7.22699ZM15.7123 7.22705L7.22699 15.7123L8.28765 16.773L16.7729 8.28771L15.7123 7.22705ZM16.7729 15.7123L8.28765 7.22699L7.22699 8.28765L15.7123 16.7729L16.7729 15.7123Z\"/>\n</svg>","data":{"search":{"exclude":true},"embed":{"meta":{"html":"<svg width=\"auto\" height=\"auto\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M16.7729 8.28771C17.0658 7.99481 17.0658 7.51994 16.7729 7.22705C16.48 6.93415 16.0052 6.93415 15.7123 7.22705L16.7729 8.28771ZM7.22699 15.7123C6.9341 16.0052 6.9341 16.4801 7.22699 16.773C7.51989 17.0659 7.99476 17.0659 8.28765 16.773L7.22699 15.7123ZM15.7123 16.7729C16.0052 17.0658 16.48 17.0658 16.7729 16.7729C17.0658 16.48 17.0658 16.0052 16.7729 15.7123L15.7123 16.7729ZM8.28765 7.22699C7.99476 6.9341 7.51989 6.9341 7.22699 7.22699C6.9341 7.51989 6.9341 7.99476 7.22699 8.28765L8.28765 7.22699ZM15.7123 7.22705L7.22699 15.7123L8.28765 16.773L16.7729 8.28771L15.7123 7.22705ZM16.7729 15.7123L8.28765 7.22699L7.22699 8.28765L15.7123 16.7729L16.7729 15.7123Z\"/>\n</svg>","div":false,"script":false,"compilable":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]}}},{"_id":"f2271d3d-1e34-cdd1-4e30-54f5410a22e0","type":"Block","tag":"div","classes":["d32fac10-49bc-c8bd-a319-1ec7ace0f2a9"],"children":["b4dbf2a7-e9c7-42f4-0440-7b9ce48e7a80"],"data":{"text":true,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"b4dbf2a7-e9c7-42f4-0440-7b9ce48e7a80","text":true,"v":"Click anywhere on this banner to learn more"},{"_id":"94fa598d-acb5-2c95-6ce4-b3b287d88f5b","type":"HtmlEmbed","tag":"div","classes":["d32fac10-49bc-c8bd-a319-1ec7ace0f2a8"],"children":[],"v":"<svg width=\"auto\" height=\"auto\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n\t<path d=\"M14 16L18 12M18 12L14 8M18 12L6 12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n</svg>","data":{"search":{"exclude":true},"embed":{"meta":{"html":"<svg width=\"auto\" height=\"auto\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n\t<path d=\"M14 16L18 12M18 12L14 8M18 12L6 12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n</svg>","div":false,"script":false,"compilable":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]}}}],"styles":[{"_id":"d32fac10-49bc-c8bd-a319-1ec7ace0f2a6","fake":false,"type":"class","name":"banner-20","namespace":"","comb":"","styleLess":"position: relative; display: flex; width: 100%; padding-top: 1rem; padding-right: 2rem; padding-bottom: 1rem; padding-left: 2rem; flex-direction: row; justify-content: center; flex-wrap: nowrap; align-items: center; grid-column-gap: 0.25rem; grid-row-gap: 0.25rem; background-color: #eef3fa; color: #0f1929; font-weight: 700; text-decoration: none;","variants":{"small":{"styleLess":"flex-direction: column; flex-wrap: nowrap; text-align: center;"}},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"d32fac10-49bc-c8bd-a319-1ec7ace0f2a7","fake":false,"type":"class","name":"banner-20_close","namespace":"","comb":"","styleLess":"position: absolute; right: 0.5rem;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"d32fac10-49bc-c8bd-a319-1ec7ace0f2a8","fake":false,"type":"class","name":"banner-20_icon","namespace":"","comb":"","styleLess":"width: 1.25rem; height: 1.25rem;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"d32fac10-49bc-c8bd-a319-1ec7ace0f2a9","fake":false,"type":"class","name":"banner-20_text","namespace":"","comb":"","styleLess":"","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