Koala UI

Team

The people behind the product, eight ways: a portrait grid, a wall of faces, a rail that runs off the page, cards with bios, a compact directory, round portraits, a sticky split and the whole company drifting past.

Variant 1

Variant 2

Pro

Variant 3

Pro

Variant 4

Pro

Variant 5

Pro

Variant 6

Pro

Variant 7

Pro

Variant 8

Pro

Installation#

# One-time setup (tokens + lib helpers)npx koalaui-cli@latest init# Add this component (its dependencies come along)npx koalaui-cli@latest add team-member

Built from#

Every roster is the same primitive dressed differently. TeamMember carries the person: a photo frame, the name, the role, an optional bio and a row of links. Its layout puts the photo above the copy, beside it, or under it with the copy set on the photo; its variant adds an outline box, and the frame's shape is a portrait, a square or a circle. The crowd in the last variant is the Avatar component with a flag in its corner badge.

Responsive#

The grids step down a column at a time and always to an even count, so eight people never leave one alone on the last row: four columns become two, three become two and then one. The rail keeps its row and becomes a swipe, the sticky split stacks its lede above the portraits, and the drifting rows fade out at the edges of any frame.

FAQ#

Remote Unsplash crops, so a section renders the moment it lands in your project. Swap each URL for your own team's pictures, or pass next/image as the child of TeamMemberMedia: the frame crops whatever it holds.