{"id":1201570,"date":"2026-05-13T21:29:42","date_gmt":"2026-05-13T21:29:42","guid":{"rendered":"https:\/\/wordpress.org\/patterns\/?post_type=wporg-pattern&#038;p=1201570"},"modified":"2026-05-13T21:29:42","modified_gmt":"2026-05-13T21:29:42","slug":"modern-gradient-landing-hero","status":"publish","type":"wporg-pattern","link":"https:\/\/it.wordpress.org\/patterns\/pattern\/modern-gradient-landing-hero\/","title":{"rendered":"Modern Gradient Landing Hero"},"content":{"rendered":"\n<div class=\"wp-block-group alignfull is-layout-constrained wp-block-group-is-layout-constrained has-background\" style=\"padding-bottom:var(--wp--preset--spacing--70);background-image:var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange);\">\n<div class=\"wp-block-group alignfull has-white-color has-text-color has-link-color wp-elements-234925d3af6d5909fa741582f42a69e7 is-layout-constrained wp-container-core-group-is-layout-02312d1c wp-block-group-is-layout-constrained\" style=\"padding-top:15px;padding-right:var(--wp--preset--spacing--30);padding-bottom:0px;padding-left:var(--wp--preset--spacing--30)\">\n<div class=\"wp-block-group alignwide is-content-justification-space-between is-layout-flex wp-container-core-group-is-layout-eb8a1b9b wp-block-group-is-layout-flex\">\n<div class=\"wp-block-group is-content-justification-left is-layout-flex wp-container-core-group-is-layout-a90dccff wp-block-group-is-layout-flex\"><div class=\"is-default-size wp-block-site-logo wp-container-content-759e20a8\"><span class=\"custom-logo-link\"><img decoding=\"async\" src=\"https:\/\/s.w.org\/images\/wmark.png\" class=\"custom-logo\" alt=\"Logo del sito\"><\/span><\/div><\/div>\n\n\n\n<div class=\"wp-block-group is-horizontal is-layout-flex wp-container-core-group-is-layout-e788c405 wp-block-group-is-layout-flex\"><nav class=\"is-responsive wp-block-navigation is-layout-flex wp-block-navigation-is-layout-flex\" \n\t\t data-wp-interactive=\"core\/navigation\" data-wp-context='{\"overlayOpenedBy\":{\"click\":false,\"hover\":false,\"focus\":false},\"type\":\"overlay\",\"roleAttribute\":\"\",\"ariaLabel\":\"Menu\"}'><button aria-haspopup=\"dialog\" aria-label=\"Apri menu\" class=\"wp-block-navigation__responsive-container-open\" \n\t\t\t\tdata-wp-on--click=\"actions.openMenuOnClick\"\n\t\t\t\tdata-wp-on--keydown=\"actions.handleMenuKeydown\"\n\t\t\t><svg width=\"24\" height=\"24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\"><path d=\"M4 7.5h16v1.5H4z\"><\/path><path d=\"M4 15h16v1.5H4z\"><\/path><\/svg><\/button>\n\t\t\t\t<div class=\"wp-block-navigation__responsive-container\"  id=\"modal-1\" \n\t\t\t\tdata-wp-class--has-modal-open=\"state.isMenuOpen\"\n\t\t\t\tdata-wp-class--is-menu-open=\"state.isMenuOpen\"\n\t\t\t\tdata-wp-watch=\"callbacks.initMenu\"\n\t\t\t\tdata-wp-on--keydown=\"actions.handleMenuKeydown\"\n\t\t\t\tdata-wp-on--focusout=\"actions.handleMenuFocusout\"\n\t\t\t\ttabindex=\"-1\"\n\t\t\t>\n\t\t\t\t\t<div class=\"wp-block-navigation__responsive-close\" tabindex=\"-1\">\n\t\t\t\t\t\t<div class=\"wp-block-navigation__responsive-dialog\" \n\t\t\t\tdata-wp-bind--aria-modal=\"state.ariaModal\"\n\t\t\t\tdata-wp-bind--aria-label=\"state.ariaLabel\"\n\t\t\t\tdata-wp-bind--role=\"state.roleAttribute\"\n\t\t\t>\n\t\t\t\t\t\t\t<button aria-label=\"Chiudi menu\" class=\"wp-block-navigation__responsive-container-close\" \n\t\t\t\tdata-wp-on--click=\"actions.closeMenuOnClick\"\n\t\t\t><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" width=\"24\" height=\"24\" aria-hidden=\"true\" focusable=\"false\"><path d=\"m13.06 12 6.47-6.47-1.06-1.06L12 10.94 5.53 4.47 4.47 5.53 10.94 12l-6.47 6.47 1.06 1.06L12 13.06l6.47 6.47 1.06-1.06L13.06 12Z\"><\/path><\/svg><\/button>\n\t\t\t\t\t\t\t<div class=\"wp-block-navigation__responsive-container-content\" \n\t\t\t\tdata-wp-watch=\"callbacks.focusFirstElement\"\n\t\t\t id=\"modal-1-content\">\n\t\t\t\t\t\t\t\t<ul class=\"wp-block-navigation__container is-responsive wp-block-navigation\"><li class=\"wp-block-navigation-item wp-block-navigation-link\"><a class=\"wp-block-navigation-item__content\"  href=\"#\"><span class=\"wp-block-navigation-item__label\">Home<\/span><\/a><\/li><li class=\"wp-block-navigation-item wp-block-navigation-link\"><a class=\"wp-block-navigation-item__content\"  href=\"#\"><span class=\"wp-block-navigation-item__label\">About<\/span><\/a><\/li><li class=\"wp-block-navigation-item wp-block-navigation-link\"><a class=\"wp-block-navigation-item__content\"  href=\"#\"><span class=\"wp-block-navigation-item__label\">Contact<\/span><\/a><\/li><\/ul>\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div><\/nav>\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div style=\"--wp--block-button--width: 100;\" class=\"wp-block-button has-custom-width wp-block-button__width wp-block-button__width-100\"><a class=\"wp-block-button__link has-white-color has-luminous-vivid-orange-to-vivid-red-gradient-background has-text-color has-background has-link-color wp-element-button\" style=\"border-top-left-radius:50px;border-top-right-radius:50px;border-bottom-left-radius:50px;border-bottom-right-radius:50px;padding-top:12px;padding-right:15px;padding-bottom:12px;padding-left:15px\">Login<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<h1 class=\"wp-block-heading has-text-align-center has-white-color has-text-color has-link-color wp-elements-a819efdd08a1a0d0afb83d72b3e16f9c\"><strong>Modern. Gradient. Landing Page<\/strong><\/h1>\n\n\n\n<p class=\"has-text-align-center has-white-color has-text-color has-link-color wp-elements-9c7cdbc0b2fa893d6f56d65690f7c28b wp-block-paragraph\">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.<\/p>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-36078703 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-white-color has-luminous-vivid-orange-to-vivid-red-gradient-background has-text-color has-background has-link-color has-text-align-center wp-element-button\" style=\"border-top-left-radius:50px;border-top-right-radius:50px;border-bottom-left-radius:50px;border-bottom-right-radius:50px\">Get Started<\/a><\/div>\n<\/div>\n<\/div>\n","protected":false},"author":23199674,"parent":0,"template":"","meta":{"wpop_keywords":"landing page, gradient, banner, call to action, hero section","wpop_description":"A bold and modern landing page hero section with a vibrant gradient background, centered headline, supporting text, navigation action, and a prominent call-to-action button. Perfect for startups, apps, portfolios, and modern business websites.","wpop_viewport_width":1200,"wpop_block_types":[],"wpop_locale":"en_US","wpop_wp_version":"","wpop_contains_block_types":"core\/button,core\/buttons,core\/group,core\/heading,core\/navigation,core\/paragraph,core\/site-logo","footnotes":""},"pattern-categories":[60,42,5],"pattern-keywords":[],"wporg-pattern-flag-reason":[],"class_list":["post-1201570","wporg-pattern","type-wporg-pattern","status-publish","hentry","wporg-pattern-category-banner","wporg-pattern-category-call-to-action","wporg-pattern-category-header"],"category_slugs":["banner","call-to-action","header"],"keyword_slugs":[],"pattern_content":"<!-- wp:group {\"className\":\"alignfull\",\"style\":{\"background\":{\"gradient\":\"var:preset|gradient|luminous-vivid-amber-to-luminous-vivid-orange\"},\"spacing\":{\"padding\":{\"bottom\":\"var:preset|spacing|70\"}}},\"layout\":{\"type\":\"constrained\"}} -->\n<div class=\"wp-block-group alignfull\" style=\"padding-bottom:var(--wp--preset--spacing--70)\"><!-- wp:group {\"metadata\":{\"categories\":[\"header\",\"wireframe\"],\"patternName\":\"core\/simple-header-with-dark-background\",\"name\":\"Header\"},\"align\":\"full\",\"style\":{\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|white\"}}},\"spacing\":{\"padding\":{\"top\":\"15px\",\"right\":\"var:preset|spacing|30\",\"bottom\":\"0px\",\"left\":\"var:preset|spacing|30\"}}},\"textColor\":\"white\",\"layout\":{\"type\":\"constrained\"}} -->\n<div class=\"wp-block-group alignfull has-white-color has-text-color has-link-color\" style=\"padding-top:15px;padding-right:var(--wp--preset--spacing--30);padding-bottom:0px;padding-left:var(--wp--preset--spacing--30)\"><!-- wp:group {\"align\":\"wide\",\"layout\":{\"type\":\"flex\",\"justifyContent\":\"space-between\",\"flexWrap\":\"wrap\"}} -->\n<div class=\"wp-block-group alignwide\"><!-- wp:group {\"layout\":{\"type\":\"flex\",\"justifyContent\":\"left\"}} -->\n<div class=\"wp-block-group\"><!-- wp:site-logo {\"style\":{\"layout\":{\"selfStretch\":\"fixed\",\"flexSize\":\"100px\"}}} \/--><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:group {\"style\":{\"spacing\":{\"blockGap\":\"30px\"}},\"layout\":{\"type\":\"flex\",\"flexWrap\":\"wrap\",\"orientation\":\"horizontal\"}} -->\n<div class=\"wp-block-group\"><!-- wp:navigation \/-->\n\n<!-- wp:buttons -->\n<div class=\"wp-block-buttons\"><!-- wp:button {\"textColor\":\"white\",\"gradient\":\"luminous-vivid-orange-to-vivid-red\",\"style\":{\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|white\"}}},\"spacing\":{\"padding\":{\"left\":\"15px\",\"right\":\"15px\",\"top\":\"12px\",\"bottom\":\"12px\"}},\"dimensions\":{\"width\":\"100%\"},\"border\":{\"radius\":{\"topLeft\":\"50px\",\"topRight\":\"50px\",\"bottomLeft\":\"50px\",\"bottomRight\":\"50px\"}}}} -->\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-white-color has-luminous-vivid-orange-to-vivid-red-gradient-background has-text-color has-background has-link-color wp-element-button\" style=\"border-top-left-radius:50px;border-top-right-radius:50px;border-bottom-left-radius:50px;border-bottom-right-radius:50px;padding-top:12px;padding-right:15px;padding-bottom:12px;padding-left:15px\">Login<\/a><\/div>\n<!-- \/wp:button --><\/div>\n<!-- \/wp:buttons --><\/div>\n<!-- \/wp:group --><\/div>\n<!-- \/wp:group --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:heading {\"level\":1,\"style\":{\"typography\":{\"textAlign\":\"center\"},\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|white\"}}}},\"textColor\":\"white\"} -->\n<h1 class=\"wp-block-heading has-text-align-center has-white-color has-text-color has-link-color\"><strong>Modern. Gradient. Landing Page<\/strong><\/h1>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph {\"style\":{\"typography\":{\"textAlign\":\"center\"},\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|white\"}}}},\"textColor\":\"white\"} -->\n<p class=\"has-text-align-center has-white-color has-text-color has-link-color\">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:buttons {\"layout\":{\"type\":\"flex\",\"justifyContent\":\"center\"}} -->\n<div class=\"wp-block-buttons\"><!-- wp:button {\"textColor\":\"white\",\"gradient\":\"luminous-vivid-orange-to-vivid-red\",\"style\":{\"typography\":{\"textAlign\":\"center\"},\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|white\"}}},\"border\":{\"radius\":{\"topLeft\":\"50px\",\"topRight\":\"50px\",\"bottomLeft\":\"50px\",\"bottomRight\":\"50px\"}}}} -->\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-white-color has-luminous-vivid-orange-to-vivid-red-gradient-background has-text-color has-background has-link-color has-text-align-center wp-element-button\" style=\"border-top-left-radius:50px;border-top-right-radius:50px;border-bottom-left-radius:50px;border-bottom-right-radius:50px\">Get Started<\/a><\/div>\n<!-- \/wp:button --><\/div>\n<!-- \/wp:buttons --><\/div>\n<!-- \/wp:group -->","favorite_count":0,"author_meta":{"name":"Dharti Patel","url":"https:\/\/it.wordpress.org\/patterns\/author\/dhartipatel","avatar":"https:\/\/secure.gravatar.com\/avatar\/77c18e79e79fe6325f9ec2db53418d2afbfd423362d80c337e1575a36c2ffbab?s=64&d=mm&r=g"},"unlisted_reason":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/1201570","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern"}],"about":[{"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/types\/wporg-pattern"}],"version-history":[{"count":9,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/1201570\/revisions"}],"predecessor-version":[{"id":1202051,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/1201570\/revisions\/1202051"}],"author":[{"embeddable":true,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wporg\/v1\/users\/dhartipatel"}],"wp:attachment":[{"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/media?parent=1201570"}],"wp:term":[{"taxonomy":"wporg-pattern-category","embeddable":true,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/pattern-categories?post=1201570"},{"taxonomy":"wporg-pattern-keyword","embeddable":true,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/pattern-keywords?post=1201570"},{"taxonomy":"wporg-pattern-flag-reason","embeddable":true,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern-flag-reason?post=1201570"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}