Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Team blocks

Pro

Investors Table Team Block for Ark UI

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 Ark 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.

All 126 team blocks