Hero12

Hero12 is a hero section that features a marquee of chips with text, a headline and caption, a call-to-action button, and a decorative background with circles. The design utilizes MUI components and custom elements such as GradientFab and SvgIcon, with a responsive layout and styling.

All available props for the Hero12 component are defined and handled within Component usage path file. This allows for easy modifications to the content of the hero section.

Component path: src/blocks/hero/Hero12.tsx

Component usage path: src/app/blocks/hero/hero12/page.tsx

Preview link: https://www.saasable.io/blocks/hero/hero12

Props Details

Prop	Type	Description	Displayed as
headLine	string | ReactElement	Main heading or title of the section.	"Empower Your Cloud Experience with Unmatched Optimization Precision"
captionLine	string | ReactElement	Secondary line of text for additional context.	"Seamlessly fine-tune and optimize your cloud resources using cutting-edge analytics and automation tools."
list	string[]	List of items to display in the marquee.	["Feature 1", "Feature 2", "Feature 3", "Feature 4"]
exploreBtn	ButtonProps	Properties for the "Explore" button.	{ variant: "contained", color: "primary", children: "Explore Now" }