---
title: "Team grid"
description: "A heading and a line, then eight people with initials, name, role and place, and an email or website link for each."
plan: Pro
docs: https://ui.edbn.me/docs/blocks/team-grid
---

# Team grid

A heading and a line, then eight people with initials, name, role and place, and an email or website link for each.

Each person sits under a hairline with their initials in an Avatar (or a photo, through avatarSrc), name, role and where they work from, with icon links for email and, where given, their own site; every link carries a visually hidden label naming the person. Four across on a wide page, two at tablet width and one on phones. The icon links' inset is pulled back so the last one ends on the column's edge, and the heading drops to title size on phones.

A Pro block built on Base UI and Tailwind CSS v4.

## Installation

This is a Pro item. Once per project, create a token at https://ui.edbn.me/dashboard/tokens, put it in `.env.local` as `EDBN_TOKEN`, and add the registry to `components.json`:

```json
{
  "registries": {
    "@edbn": {
      "url": "https://ui.edbn.me/r/{name}.json",
      "headers": { "Authorization": "Bearer ${EDBN_TOKEN}" }
    }
  }
}
```

Then install:

```bash
npx shadcn@4.19.0 add @edbn/team-grid
```

## Dependencies
- npm: lucide-react@^1.33.0
- edbn: edbn-base, avatar, button

## Source

The source is part of Pro (https://ui.edbn.me/pricing). The install above adds it to the project, ready to edit.

## More team blocks

All 3, with install commands: https://ui.edbn.me/docs/blocks/team (Markdown: https://ui.edbn.me/docs/blocks/team.md)

## For agents
- Base theme, once per project: npx shadcn@4.19.0 add https://ui.edbn.me/r/edbn-base.json
- MCP server with search, items, examples and source: https://ui.edbn.me/mcp
- Every page and item: https://ui.edbn.me/llms.txt