Particle Hero Banner is an interactive hero module with mouse-responsive particle effects, supporting image, video, or color backgrounds. It offers flexible alignment, height control, and full customization, and is fully responsive for all devices.
Particle Hero Banner Documention
1. Introduction (Overview)
2. Key Features
- Interactive Particle Effect – Particles move dynamically with mouse interaction
- Background Type Options – Use image, video, or solid color backgrounds
- Content Alignment Control – Align content left, center, or right
- Background Height Option – Set custom heights for desktop, tablet, and mobile
- Custom Headings & Descriptions – Easily edit text content
- Module Width Control – Choose full-width or custom container
- Spacing & Styling Options – Adjust padding, margins, and colors
- Fully Responsive Design – Optimized for all screen sizes
3. Installation – Downloading the Module from HubSpot Marketplace
- Log in to your HubSpot account.
- Go to the Marketplace from the main navigation menu.
- Search for your module by name.
- Find the module in the results and click Install.
- If it’s a paid module, you can also click Buy Now to purchase and install directly.
4. How to Use – Adding the Module to Your Page
- Open your HubSpot page editor.
- Click on Add Module.
- Search for your module by name.
- Drag and drop the module into the desired section of your page.
-
Particle Hero Banner is a highly customizable hero module featuring interactive particle animations that respond to mouse movement. You can choose between background images, videos, or solid colors, adjust content alignment, control banner height for desktop, tablet, and mobile, and style every element to match your brand. Fully responsive and designed to create a modern, engaging first impression.
5. Module Settings Guide
1. Content Tab- Content Customization
Edit and update subheadings, headings, and descriptions easily. - Multiple Buttons Option
Add one or two buttons per banner for calls-to-action. - Background Type Options
Choose between solid color, background image, or video.
2. Style Tab
- Content Alignment Control – Align content left, center, or right
- Background Height Option – Set custom heights for desktop, tablet, and mobile
- Custom Headings & Descriptions – Style fonts, colors, line height, and responsive sizes.
- Module Width Control – Choose full-width or custom container
- Spacing & Styling Options – Adjust padding, margins, and colors
- Fully Customizable - Adjust card colors, typography, shadows, and spacing.

6. Examples / Demo Preview
View the module in action:https://www.modfrybus.shop/particle-hero-banner
7. Support & Contact
For questions or support, contact us at productqueriemodfrybus@outlook.com We’re happy to help!