Hero - Simple Left Text
Full width text banner with left aligned text and background image.
View a live demo of this section.
Modules:
Usage Guide
The Hero - Simple Left Text section creates a powerful first impression for your HubSpot pages with its clean, asymmetrical design. This section works exceptionally well as the opening element on landing pages, service pages, or campaign-specific content where you want to immediately communicate your value proposition without overwhelming visitors.
When you add this section through the HubSpot page editor’s drag-and-drop interface, you’ll find it offers more flexibility than standard hero sections. The left-aligned text creates natural white space on the right side of your background image, making it ideal when you have visually striking photography or graphics that shouldn’t be covered by centered text overlays.
Content Strategy Tips:
- Keep your headline concise since the left alignment works best with 1-2 lines of text
- Use the Theme Rich Text module to add CTAs, bullet points, or formatted subheadings below your main message
- Choose background images with visual interest on the right side to balance the left-aligned content
Background Customization: The Background Overlay module gives you precise control over image opacity and color tinting through the page editor. This is particularly useful when your background image doesn’t provide enough contrast for readable text. You can adjust these settings without touching any code, making it easy for content teams to maintain brand consistency across different campaigns.
This section performs well on both desktop and mobile devices, automatically stacking the content vertically on smaller screens while maintaining readability. Consider pairing it with complementary sections like testimonials or feature grids to create compelling page layouts that guide visitors toward conversion.