Hero1

A dynamic hero section component with animated text reveal and scrolling images

Installation

Import the component:

import Hero1 from "@/components/sections/Hero1"

Basic Usage

A simple hero section with animated text and default styling.

BLUEPRINT UI LIBRARY

From Spark to Solution

Innovative solutions for an ever changing technology landscape

Image 4
Image 2
Image 3
Image 1
Image 4
Image 2
Image 3
Image 1
Whenweengagewithaclient,webringtogetherourexperienceworkingacrossbrandstrategy,communications,policyanddigitaltoofferaunifiedperspective.Weworkasanextensionofyourteamtoquicklyidentifywhat’sholdingyourbusinessback,designasolution,andbringtogetherthetalentandtoolstodeliverresults.

Props

Prop
Type
Default
Description
id
string
—

Optional ID for anchor linking to this section. Defaults to 'hero1'.

headingType
string
—

HTML heading tag to use for the main heading

icon
string
—

Path to the icon image displayed between headings

primaryHeading
string
—

First part of the main heading

secondaryHeading
string
—

Second part of the main heading

subtitle
string
—

Subtitle text displayed below the main heading

scrollImages
Array<{ url: string, width: number, height: number, alt: string }>
—

Array of image objects for the scrolling gallery

textRevealBody
string
—

Text content to be revealed with animation effect

theme
string
—

Optional theme override for this section (light, dark, modern)