Marketing blocks
Team sections
Team sections: round-avatar grid, large photo grid, list rows and a split layout. Uses the Avatar atom; pass image per member for photos. Figma: Team section.
import
{ TeamSection, type TeamMember, type TeamLayout } from "@pepulux/ui"Grid
Our team
Meet our team
The people behind the product.
Photos (muted)
List
Our leadership
Experienced, curious and kind.
- OR
- PB
- LS
Split
A small team with big ambitions
Brand
Meet the team
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| layout | "grid" | "photos" | "list" | "split" | "grid" | Figma layout |
| tone | "light" | "muted" | "brand" | "light" | Background tone — Figma Light / Muted / Brand |
| members | TeamMember[] | — | { name; role; bio?; image?; socials? } |
| columns | 2 | 3 | 4 | 4 | Grid / photos columns |
| primaryAction | { label; onClick? } | — | Button next to the heading |