Table

A growing collection of 20 table components built with React and Tailwind CSS.

Name	Email	Location	Status	Balance
Alex Thompson	alex.t@company.com	San Francisco, US	Active	$1,250.00
Sarah Chen	sarah.c@company.com	Singapore	Active	$600.00
James Wilson	j.wilson@company.com	London, UK	Inactive	$650.00
Maria Garcia	m.garcia@company.com	Madrid, Spain	Active	$0.00
David Kim	d.kim@company.com	Seoul, KR	Active	-$1,000.00
Total				$2,500.00

Basic table

Name	Email	Location	Status	Balance
Alex Thompson @alexthompson	alex.t@company.com	San Francisco, US	Active	$1,250.00
Sarah Chen @sarahchen	sarah.c@company.com	Singapore	Active	$600.00
Maria Garcia @mariagarcia	m.garcia@company.com	Madrid, Spain	Active	$0.00
David Kim @davidkim	d.kim@company.com	Seoul, KR	Active	-$1,000.00

Table with images

Name	Email	Location	Status	Balance
Alex Thompson	alex.t@company.com	San Francisco, US	Active	$1,250.00
Sarah Chen	sarah.c@company.com	Singapore	Active	$600.00
James Wilson	j.wilson@company.com	London, UK	Inactive	$650.00
Maria Garcia	m.garcia@company.com	Madrid, Spain	Active	$0.00
David Kim	d.kim@company.com	Seoul, KR	Active	-$1,000.00
Total				$2,500.00

Table without horizontal dividers

Name	Email	Location	Status	Balance
Alex Thompson	alex.t@company.com	San Francisco, US	Active	$1,250.00
Sarah Chen	sarah.c@company.com	Singapore	Active	$600.00
James Wilson	j.wilson@company.com	London, UK	Inactive	$650.00
Maria Garcia	m.garcia@company.com	Madrid, Spain	Active	$0.00
David Kim	d.kim@company.com	Seoul, KR	Active	-$1,000.00
Total				$2,500.00

Striped table

Name	Email	Location	Status	Balance
Alex Thompson	alex.t@company.com	San Francisco, US	Active	$1,250.00
Sarah Chen	sarah.c@company.com	Singapore	Active	$600.00
James Wilson	j.wilson@company.com	London, UK	Inactive	$650.00
Maria Garcia	m.garcia@company.com	Madrid, Spain	Active	$0.00
David Kim	d.kim@company.com	Seoul, KR	Active	-$1,000.00

Table with vertical lines

Name	Release Year	Developer	Typing	Paradigm	Extension	Latest Version	Popularity
JavaScript	1995	Brendan Eich	Dynamic	Multi-paradigm	.js	ES2021	High
Python	1991	Guido van Rossum	Dynamic	Multi-paradigm	.py	3.10	High
Java	1995	James Gosling	Static	Object-oriented	.java	17	High
C++	1985	Bjarne Stroustrup	Static	Multi-paradigm	.cpp	C++20	High
Ruby	1995	Yukihiro Matsumoto	Dynamic	Multi-paradigm	.rb	3.0	Low

Dense table

	Name	Email	Location	Status	Balance
	Alex Thompson	alex.t@company.com	San Francisco, US	Active	$1,250.00
	Sarah Chen	sarah.c@company.com	Singapore	Active	$600.00
	James Wilson	j.wilson@company.com	London, UK	Inactive	$650.00
	Maria Garcia	m.garcia@company.com	Madrid, Spain	Active	$0.00
	David Kim	d.kim@company.com	Seoul, KR	Active	-$1,000.00
Total					$2,500.00

Table with row selection

	Name	Email	Location	Status	Balance
	Alex Thompson	alex.t@company.com	San Francisco, US	Active	$1,250.00
	Sarah Chen	sarah.c@company.com	Singapore	Active	$600.00
	James Wilson	j.wilson@company.com	London, UK	Inactive	$650.00
	Maria Garcia	m.garcia@company.com	Madrid, Spain	Active	$0.00
	David Kim	d.kim@company.com	Seoul, KR	Active	-$1,000.00
Total					$2,500.00

Card Table

Name	David Kim
Email	d.kim@company.com
Location	Seoul, KR
Status	Active
Balance	$1,000.00

Vertical table

Name	Email	Location	Status	Balance
Alex Thompson	alex.t@company.com	San Francisco, US	Active	$1,250.00
Sarah Chen	sarah.c@company.com	Singapore	Active	$600.00
James Wilson	j.wilson@company.com	London, UK	Inactive	$650.00
Maria Garcia	m.garcia@company.com	Madrid, Spain	Active	$0.00
David Kim	d.kim@company.com	Seoul, KR	Active	-$1,000.00
John Brown	john.brown@company.com	New York, US	Active	$1,500.00
Jane Doe	jane.doe@company.com	Paris, FR	Inactive	$200.00
Peter Smith	peter.smith@company.com	Berlin, DE	Active	$1,000.00
Olivia Lee	olivia.lee@company.com	Tokyo, JP	Active	$500.00
Liam Chen	liam.chen@company.com	Shanghai, CN	Inactive	$300.00
Ethan Kim	ethan.kim@company.com	Busan, KR	Active	$800.00
Ava Brown	ava.brown@company.com	London, UK	Active	$1,200.00
Lily Lee	lily.lee@company.com	Seoul, KR	Active	$400.00
Noah Smith	noah.smith@company.com	New York, US	Inactive	$600.00
Eve Chen	eve.chen@company.com	Taipei, TW	Active	$1,800.00
Total				$2,500.00

Table with sticky header

	Desktop browsers					Mobile browsers
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox Android	Opera Android	Safari iOS	Samsung Internet
scroll-timeline	Supported 115	Supported 115	Not supported 111	Supported 101	Not supported No	Supported 115	Not supported No	Supported 77	Not supported No	Supported 23
view-timeline	Supported 115	Supported 115	Not supported 114	Supported 101	Not supported No	Supported 115	Not supported No	Supported 77	Not supported No	Supported 23
font-size-adjust	Supported 127	Supported 127	Not supported 3	Supported 113	Supported 16.4	Supported 127	Supported 4	Supported 84	Supported 16.4	Not supported No

	Name	Email	Location	Status	Balance
No results.
Total					$0.00

Basic data table made with TanStack Table

Keyword

Intents

Volume

CPC

Traffic

Keyword	Intents	Volume	CPC	Traffic	Link
react ui kit premium	C T	760	$6.8	28	https://originui.com/avatar
react component documentation	I N	950	$1.8	35	https://originui.com
how to use react components	I	1.2K	$1.25	42	https://originui.com/table
tailwind components download	T	890	$1.95	45	https://originui.com/alert
buy react templates	C T	1.9K	$4.75	65	https://originui.com/input
react components	I N	2.5K	$2.5	88	https://originui.com
react ui library	I C	3.2K	$3.25	112	https://originui.com/badge
react dashboard template free	C T	4.1K	$5.5	156	https://originui.com/tabs

Data table with filters made with TanStack Table

Name	Email	Location	Status	Balance	Department	Role	Join Date	Last Active	Performance
No results.

Resizable and sortable columns made with TanStack Table

Name	Email	Location	Status	Balance	Department	Role	Join Date	Last Active	Performance
No results.

Pinnable columns made with TanStack Table

Name	Email	Location	Status	Balance
No results.

Draggable columns made with TanStack Table and dnd kit

		Name	Email	Location	Status	Balance
No results.

Expanding sub-row made with TanStack Table

	Name	Email	Location	Status	Balance
No results.

1-0 of 0

Paginated table made with TanStack Table

	Name	Email	Location	Status	Balance
No results.

Page 1 of 0

Numeric pagination made with TanStack Table

	Name	Email	Location	Status	Performance	Balance	Actions
No results.

1-0 of 0

Example of a more complex table made with TanStack Table

Didn't find what you were looking for?

Suggest component