Team Section
Interactive team member showcase with GSAP-powered hover animations. Names animate in on profile hover.
Props
18 total| Prop | Type | Default | Description |
|---|---|---|---|
| members* | Array<{ image: string; name: string; imageClassName?: string; imageStyle?: CSSProperties; nameClassName?: string; nameStyle?: CSSProperties }> | — | Array of team members. Each member has: image (profile photo URL), name (display name), and optional styling props |
| defaultName | string | "Our Squad" | Text displayed when no member is hovered |
| backgroundColor | string | "#0f0f0f" | Background color of the section (CSS color value) |
| textColor | string | "#e3e3db" | Default text color for the name display |
| accentColor | string | "#f93535" | Color of the hovered member's name |
| containerClassName | string | "" | Additional CSS classes for the main container |
| containerStyle | CSSProperties | {} | Inline styles for the main container |
| profileImagesContainerClassName | string | "" | CSS classes for the images container |
| profileImagesContainerStyle | CSSProperties | {} | Inline styles for the images container |
| profileNamesContainerClassName | string | "" | CSS classes for the names container |
| profileNamesContainerStyle | CSSProperties | {} | Inline styles for the names container |
| defaultNameClassName | string | "" | CSS classes for the default name heading |
| defaultNameStyle | CSSProperties | {} | Inline styles for the default name |
| memberNameClassName | string | "" | CSS classes for all member name headings |
| memberNameStyle | CSSProperties | {} | Inline styles for all member names |
| hoverScaleFactor | number | 2 | Scale multiplier when a profile image is hovered |
| animDuration | number | 0.75 | Animation duration in seconds |
| charStagger | number | 0.025 | Stagger delay between each character animation |