Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Team blocks

Pro

Investors Table Team Block for React

The backers of an escrow service as a figures band (raised, rounds, investors) over a captioned table of firms, their partners, whether each led or took part, and the round it joined.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Get ProSign in
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

An investors section for React with Base UI, for Pellmore, an escrow service. A start-aligned header sits over a band of three figures split by hairlines (what has been raised, how many rounds, how many investors), and under it a captioned table runs from rail to rail and ends the block. Each of its seven rows is a firm (every firm is invented), its partner as an initials avatar and a name, a Lead or Participant chip, and the round it joined: Seed, Series A or Series B. On a phone the partner folds under the firm and the round under the role, so the table keeps two columns. It's built from Data List, Table, Badge, Avatar and Guides, with CSS transitions and your theme's tokens for every colour. For companies whose backers are part of the pitch. The amounts and firms are example data.

FAQ

How do I change the investors and the figures?

Edit INVESTORS and RAISED at the top of the file. An investor is a firm, a partner, a part (lead or participant) and a round. The "Rounds" and "Investors" figures are counted from the list; the amount raised is a string you set yourself, because the table doesn't carry cheque sizes. All the figures and the firms are invented example data.

How are the three figures built?

They are one description list from the catalog's Data List: each figure is a term (the label) and a description (the value), set side by side with a hairline between them. A screen reader reads "Raised, $14M". The amount is set left to right on a right-to-left page.

Is it a real table, and how do assistive technologies read it?

It is a native table with a caption and column headers: Firm, Partner, Role and Joined in.

The Lead chip is a filled secondary badge and the Participant chip an outlined one; both carry their word, so nothing depends on how they look.

How does it fit on a phone?

Below md the Partner and Joined in columns are removed and their text is folded under the firm and the role chip, so the table keeps two columns and doesn't scroll sideways. The three figures stay side by side, each in a third of the width.

Why are the rounds not dated?

A date on a funding round goes stale or gets contested, and it is not what a visitor needs from this block. Rounds are named, and the caption says so. Add a date column if your investors are happy to have one.

How are the lines drawn, and how does the block end?

Guides draws a top rule with + marks above the figures band and another above the table; each row draws a bottom border, except the last, and the caption sits under it with the block's padding, so the next block's top rule closes the block.

  • Pro

    Advisory Board Table Team

    Leaders and org charts

    Seven advisors of a climate-risk model company in a captioned table from rail to rail: an initials avatar and a name, their role and firm, their specialty and the year they began advising.

  • Pro

    Founders Face to Face Team

    Leaders and org charts

    Two founders of a grant-writing tool side by side, each with a list of what they did before, what they built and what they own now, and a centre column reading Met in Year 0 with a line on how they met.

  • Pro

    Backer Round Matrix About

    Press and recognition

    A backer matrix for a battery-analytics lab: a dot where a fund joined a round, a ring where it led, and that fund's note under the table when its row is picked.

  • Pro

    Rounds Funding Timeline About

    Timelines

    A funding history as three round cells, each with the amount, the lead investor, an undisclosed valuation and a segmented bar of where the money went whose four parts add to 100 percent.

  • Pro

    Leadership Spotlight Team

    Leaders and org charts

    One leader as a split band, a large initials plate with a three-paragraph bio and three figures, over four executives in cells with overshoot, each with a one-line background and expertise chips that wrap.

  • Pro

    Collaboration Ring Graph Team

    Leaders and org charts

    Nine people of a hospital rota company on a ring joined by chords: pick one and their chords go strong, the people they work with stay in tone, and a list says who they work with most and for how many hours a week.

All 126 team blocks