The Premium Services Hero Banner helps you showcase your services with a bold, visually engaging hero section that instantly captures visitor attention. Highlight your key offerings, compelling headlines, call-to-action buttons, and brand visuals with smooth animations and customizable layouts.
Fully responsive and highly customizable, this banner is designed to enhance user engagement, strengthen your brand presence, and deliver a seamless browsing experience across desktop, tablet, and mobile devices.
Key Features Premium Services Hero Banner Module :
-
Modern Hero Banner Design : Create a professional first impression with a clean, eye-catching layout.
- Background Dropping Animation : Create a captivating first impression with a smooth background dropping animation that adds depth and visual appeal to your hero banner.
-
Responsive Design: Adjusts seamlessly across devices, from desktops to mobile screens.
-
Customizable Styles: Fully customizable with CSS variables for themes, fonts, colors, and animations.
-
Performance Optimization: Lightweight animations optimized to ensure smooth interactions without lag.
- Multiple Card Support : Display multiple feature cards, service highlights, team members, or product showcases in a clean and organized layout.
How to Set Up the Premium Services Hero Banner Module in HubSpot :
In the main dashboard, navigate to the ‘Content’ tab and select either ‘Website’ or ‘Landing Pages’, depending on where you want to add the section. This allows you to choose the appropriate location for managing or updating your content.
Select the page where you want to apply the module.
-Feb-13-2026-06-36-17-9723-PM.png)
Search for "Premium Services Hero Banner" and drag and drop the module into the desired location on your page.
Module Defaults Options:
Layout ID :
To enable smooth scrolling for a CTA, assign an ID to the target element, reference that ID in the anchor link's href, and clicking the CTA will smoothly scroll the page to the section.
Top Content :
Easily customize the content in your module by modifying the "Sub Text", "Heading", "Description and "CTA". You can also choose to hide the section if desired, giving you complete control over the presentation and functionality of your content.
Options :
- Sub Text/Heading Show/Hide Toggle
- Description/CTA Show/Hide Toggle
Card Option :
Control your layout by selecting the number of cards per row.
Display 2, 3, or 4 cards based on your design needs.
Content Columns :
Users can customize each column by adding a icon, title and description to convey key information and CTA text with a link to drive engagement. Additionally, they can replicate columns as needed to match their content requirements, creating a flexible and visually cohesive layout suitable for various purposes such as showcasing features, services, or products.
Module Style Options:
Module Setting :
Adjust the margins, padding, background colors, and container width to customize the module's appearance. This flexibility lets you refine the layout and aesthetics, creating a visually appealing, functional, and user-friendly design.
Top Content Setting :
Users can customize the spacing of the heading, as well as adjust the typography for the sub text, heading, description and CTA. This includes modifying the color, font size, weight, and line height for both mobile and desktop views, allowing for a personalized and visually cohesive design across all devices.
Column Section Setting :
Users can customize column spacing and adjust the background, border, border radius and box shadow to create their desired design style.
Column Content Setting :
Users can customize the icon, title, description, and CTA typography by adjusting font size, line height, and spacing for both mobile and desktop views. They can also modify text transform and alignment. For the CTA.
We hope you enjoy using premium services hero banner module to create a seamless experience for both your users and your marketing team. At Code Accelerator, we're committed to ensuring your HubSpot experience is exceptional. If you need a custom HubSpot module or require a tailored HubSpot CMS or CRM setup, please don’t hesitate to Contact Us.